We were proud to be a Gold Sponsor for this year’s MobileUX Camp DC, held September 14 in Washington, DC. Modus staff attending the event included our new Director of UX, Jimmy Chandler, who was also one of the event’s co-organizers. This was our third consecutive year participating in and sponsoring MobileUX Camp DC.
Jimmy Chandler, Crowdsourcing Guide to Agile & Lean UX
— noemi (@nlucciola)
Jimmy Chandler led an interactive session that required participants to crowdsource a prototype mobile app. The purpose of the app is to be a resource for people on a project using Agile or Lean methods. As a group, we listed the keys to successful Agile and Lean projects, and then determined our project’s requirements. Finally, we split into several groups, each tasked with prototyping an app. Example prototype sketches:
— Dan B. (@brownorama)
Participants in the session both learned about Agile and Lean, and got to practice techniques for prototyping a mobile app.
Dan Willis, Designing Successful Experiences for Bald Apes (Slides)
— Clarissa Peterson (@clarissa)
Dan says that we can’t design the entire user experience, but we can influence the UX through our methods. He notes that there’s no place to hide stupid design on a mobile screen. Dan then goes on to challenge many of our industry’s assumptions. For example, if “data beats opinion” — how many users do we need data from for it to be better than one stakeholder’s opinion? “There’s really no such thing as mobile design problems; they’re really all about interaction design problems at that size screen.” Tried and true design methods, such as high contrast, proximity, visual hierarchy, & chunking, become even more important on mobile.
In the future, Dan argues: We will need increased focus on content strategy. Interaction is currently king on mobile, when content still needs to be king. For example: swiping through 212 pairs of underwear on a tablet on Target’s website. We need new tools (or old tools). e.g., service blueprints, journey maps, that capture the entire user experience. And we need more user data about predilections, preferences.
Chuck Borowicz, Paradigm Rejection: A Visual Designer’s Journey
Chuck spoke about how, as a designer, he has learned to work within a responsive design environment more effectively. One technique is atomic design, designing individual elements of a site/app, rather than full page mockups. Another is to create a visual inventory: take the current site apart, element by element (navigation menus, headers, ads, buttons, etc.). This helps the designer to identify where there are visual design problems.
Another is the use of Mood Boards; check out his slide deck starting at Slide #27 for how to create Mood Boards and some examples. Notes on Mood Boards:
Gather adjectives from stakeholders (e.g. “warm,” “inviting”) Ask questions about what stakeholders like about competitor sites, dribbble shots, etc. Don’t be afraid to ask questions about how the client’s product works Mood boards do not equal mockups, CSS should not be pulled from mood boards.
Chuck encourages visual designs to not pair colors and meanings, because every new meaning will need a new color, so this is a solution that does not scale.
Lastly, Chuck describes the method of Paired Prototyping, where designers are constantly on call to answer questions from developers, rather than delivering a design document with specifications. advantages. One advantage is that prototypers do not need to perform redundant work (e.g. extracting colors and font-size from a .psd).
Dana Chisnell, Stripping Away Best Practice Design to Reveal Simple Essentials
Dana described the process used to create the Anywhere Ballot, which is a tool to assist governments in creating more accessible ballot systems. The template created by the design team is available at Anywhere Ballot for anyone to try out.
The problem this project is trying to address is to make ballots more usable for the 43% of the American adult population that has difficulty reading, due either to low literacy or a reading disability. Dana recommends a technique she terms Plain Interaction, using the fewest, simplest steps to complete an action. The Anywhere Ballot design team learned a lot of lessons from usability testing of the ballot. The original design, though based on extensive user research, was quite flawed. Dana stated of the original design, “We were so wrong, and it was so awesome.”
One interesting lesson from their testing was to discover that while it was usually optimal to use plain language (very short sentences or phrases, no jargon), on one occasion they needed more text to make a button understood by all users. This just demonstrated the power of usability testing when done right.
James Melzer, A Working Vocabulary for Responsive Design
James demonstrated a series of techniques for responsive design, including:
Compress: Element spreads the entire width of the screen, compresses when the viewport is made smaller Resist: As the viewport gets smaller, the element size:view port size ratio becomes larger. Otherwise, small columns at large screen size would become too small at small screen size. [Note: Hard for developers] Stack: At smallest screen size, elements vertically stack on top of each other Push and Pull: Reorder elements depending on screen size. Assemble: Reorder groups of elements depending on screen size. Disappear & Explode: When an element is hidden, other elements adjust in size to fill the gap left by the hidden element. Lock: Specify an element’s max width. Element cannot grow any larger than this. Bleed: Remove margins, so element “bleeds” to the edges of the container. Parfait: A picture that bleeds beyond the container. Apron: Specify different rules for a part of your grid.
Jared Spool, Making Design Decisions
— Karen T. Lin (@karenTL)
Jared closed out the day with his session on how teams make design decisions. Instead of focusing on how to make the best designs, we should focus our teams and clients on making the right decisions, because that will lead to the right designs. Jared describes the various methods of design decision making, including:
Self-Design -Designing for your self. – You should use your own design, so you can find problems – Good for designing for a large audience of users that are similar to you (e.g. for internal projects)
Activity Focused Design – Focus on the activities of actual/representative users
Genius Design – Predated by several years of activity focused design to identify usage patterns that can be applied to later projects. – Periodically run small studies to verify your “gut” feelings. – If your experience does not match a situation, return to activity focused design
— Veronica Erb (@verbistheword)
Jared recommends that whatever style your team chooses, to stick with that style, don’t mix an match. Worse are teams that aren’t aware of their style, or use unintentional design.
After participating at MobileUX Camp DC and producing our own first ever conference, ModuxCon in Amsterdam, we look forward to participating in more events for the UX and Mobile communities in the near future.