Objectives:
ease onboarding of new Kalamuna team members to the artifacts our processes manifest
achieve clarity on the what, how, why of our exercises
propagate correct and identical terminology across our organization
assist sales efforts in describing what we do in proposals
help account managers sell programs
Terms:
Audience Types: Who are you talking to? What do they already know (or not know) about your industry, space, or organization? What do they need? What communications have they historically responded to? Our research will help us answer to these questions and construct “personas” -- fictional, archetypical characters we’ll use to represent your audiences, their needs and their attitudes throughout the design process.
Audience research: Interview users that align with personas and test the current site with them to identify problem areas, things that are working well, and assess needs/goals first hand.
Brand Assessment: Through stakeholder interviews and other research, we work to understand your business, your industry, your competitors and the overall communications ecosystem in which you operate.
Brand Galaxy Workshop: In this workshop, we collaborate with your internal stakeholders to understand how you want to be perceived and how that perception links to your business objectives and your audience’s needs. We’ll come away with descriptive phrases, initial thoughts on a brand “look and feel,” and maybe even your brand’s spirit animal. These takeaways serve as the bridge between strategy and creative development.
Brand Manifesto and Tagline: A brand manifesto is a written, public-facing raison d’etre for your company. Usually a few paragraphs, it is the textured, emotional manifestation of your more strategic and inward-facing positioning statement.
Communication Style Guide: A set of rules describing what your brand does and does not do, and how it expresses itself across the media landscape. Filters guide future executions of the brand and help all stakeholders get on the same page about how your brand acts in the world. (“Do we tweet about the election or not?”). Grammatical style and brand voice are defined in ways that can be extended beyond the website.
Competitive analysis: An audit of leading websites in the same industry, detailing what they do well and how they rank in comparison
Content Mapping: Content mapping is a visual technique that will help you organize and understand the content of a website. It can be a simple and valuable part of your site’s overall content strategy.
Customer Experience Journey Map: The customer journey map is an oriented graph that describes the journey of a user by representing the different touch-points that characterize his or her interaction with the service.
Discovery: The initial research phase of any project. During a project Discovery, activities will help the project team better understand the people impacted by the project, the scope of the problem to be solved, and define the desired outcomes. Generally activities are grouped under “UX research” or “Technical Analysis”, depending on the nature of the exercise and the resources performing the work. Some of the deliverables that come out of Discovery include Personas and User Stories, Customer Experience Journey Maps, Content Maps, Analytics Analysis, and Sketches. On some projects, initial design deliverables such as Mood Boards and Style Tiles may also be produced.
Information Architecture (IA): A large discipline that typically includes content structure and organization, comprised of content types, site hierarchy and navigation, taxonomy, metadata, and in some cases wireframes or layouts.
Living Style Guide: An in-browser style guide demonstrating website components and elements, with code samples
Messaging: Organizations often need to communicate their value proposition in different ways to different audiences. Your donors need to hear something different than the people you serve. We work with you to understand these communications and craft consistent, on-brand messaging for all of your audiences.
Moodboard: We compile a palette of found colors, fonts, photography and illustration styles, and other imagery that explores a visual identity for your brand. We use a moodboard to suss out the “look and feel” of a brand with a you, contrast it with your competitors’ visual identity, and hone in on an approved visual identity system.
Persona: A Persona is a fictional person representing users with similar needs, created by synthesizing research findings, that drives design and development throughout a project.
These characters allow the project team to empathize with the end-user, to ensure that we are designing and building a solution that addresses their needs and desires as opposed to our own.
Position Statement: An organization’s positioning statement is one sentence that describes who you are, what you do, who you do it for, and what makes you different. It is the strategic “north star” of any brand; we use it as a foundation upon which to build a public-facing brand. Your organization’s internal stakeholders can also use it to guide other efforts such as HR communications or new product offerings.
Project Brief: A document prepared at the beginning of a project that outlines at a high level the key elements of the project including but not limited to: project team leads including the account manager, key stakeholders, project goals and any technical requirements, anticipated timeline and budget, a list of items that are “in-scope” and “out of scope”, and any other relevant information that would help new people coming onto the project get a clear sense of what the project is about.
Project Kick off activities: workshops. Find out who is the product owner, approve the project brief, define stakeholders and more.
Responsive Prototyping: Hi-fidelity HTML/CSS/JS prototypes demonstrate how key pages and components react in different browsers and devices.
Sketching: Collaborative exercises to envision content and layout concepts for key pages. The outcomes of sketching workshops often inform the following round of wireframes and low-fidelity prototypes.
Stakeholder Interviews: Conversations with key stakeholders helps us understand everyone's goals and challenges and how we might address them
Style Tile: Visual deliverable demonstrating typography, imagery, iconography and some component-like arrangements. A hybrid hi-fidelity mockup used in Responsive Web Design as an efficient way of demonstrating a website’s intended visual style and direction prior to implementation. Usually includes the main header treatment, background and block colors, fonts, iconography and some component-like arrangements.
User Centered Design: In the user-centered design process, we are focused on the thing being designed (e.g., the object, communication, space, interface, service, etc.), looking for ways to ensure that it meets the needs of the user. The social scientist/researcher serves as the interface between the user and the designer. The researcher collects primary data or uses secondary sources to learn about the needs of the user. The researcher interprets this information, often in the form of design criteria. The designer interprets these criteria, typically through concept sketches or scenarios. The focus continues then on the design development of the thing. The researcher and user may or may not come back into the process for usability testing.
User Stories: End-user needs and desires, expressed as user stories that relate to specific personas. User stories are an integral part of Agile methodology, informing the design and implementation processes.
User Testing: Also known as usability testing or user feedback testing, in which we observe how real users react to and use the product. From this type of testing we are able to identify potential usability problems before going to production (ideally even before implementation). When conducting user feedback testing, we want to put our designs (whether it’s a wireframe, an Invision mockup, or an HTML prototype) in front of the people who are most likely going to use the site or tool we’re building. If we are not able to recruit members of the primary audience type, we can test our designs with people who are in contact with our primary users and are sensitive to their needs (such as Customer Support agents and/or Sales reps).
Value Proposition: What makes you unique among your competitors? When people seek out an organization that offers something similar, what will they get out of working with you that they can’t get somewhere else? We work with you to understand and refine your main point of differentiation and the best way to express it.
Visual Style Guide: The visual guide for your organization, based on your value proposition and your “look and feel”. The logo fits within a larger identity system, which includes a set of fonts, a tagline treatment, rules for logo manipulation and placement, photography style, and other expressions of your brand for various media.
Wireframes: Low-fidelity mockups of key pages demonstrating components and content. The wireframes are often used to create clickable prototypes that allow for early usability testing before investing more time and resources in hi-fidelity comps or code.
TO-DO:
Prototyping:
Comps (compositions):
Design system
Information Architecture (IA):
Accessibility Audit
Usability Studies
Journey Mapping
Content strategy
Kalastatic
Kalatheme
Static Site Generator
Metalsmith
Library
Assets
Bower / NPM / Grunt / etc.
Template engine:
Twig
Swig
Jade
SemVer: http://semver.org/
Grid