Fish Fingers & Custard: How to give your client what they want, even if they don’t know they want it.

WordCamp Milwaukee 2013

Transcript

1. Fish Fingers & Custard: HOW TO GIVE YOUR CLIENT WHAT THEY WANT, EVEN IF THEY DON’T KNOW THEY WANT IT.
2. James Barrett Senior UX Consultant, Magenic
3. The Value of Discovery Sessions Engage, Define, and Plan.
4. Discovery Sessions… ! Empowers the client with a voice in the design / production of the project ! Saves you time, saves the client money, and saves heartache on both sides. ! Helps vet ideas and organize features before one pixel is drawn or one line of code is written.
5. When your client says… “I want a blog on my company’s website.” “I want more traffic on my site.” “I heard that having a blog on my company’s website would make more people visit it.”
6. When your client says… “I want HTML 5 on my site.” “Everyone’s talking about HTML 5, and I don’t want to be left behind.” “I don’t want my site to be obsolete.”
7. When your client says… “I need a mobile app for my site.” “Mobile’s big right now, and I don’t want to miss out.” “My site needs to be accessible to the growing mobile user base.”
8. Gathering Requirements You don’t know where you are until you know where you aren’t.
9. General Guidelines ! Be interactive; get the client involved in the process with hands-on activities. ! Listen. Then listen some more. Then listen even more. ! Absorb now. Design later.
10. Gathering Information ! Stakeholder Interviews ! Listen for patterns ! Look for Golden Nuggets. ! Shadowing Users ! Bring a camera ! Check for artifacts ! Heuristic Evaluation ! Evaluate. Don’t Critique ! Keep it simple and direct
11. Nielsen’s Heuristics ! Match between system and the real world ! User control and freedom ! Consistency and standards ! Error prevention ! Recognition rather than recall ! Flexibility and efficiency of use ! Aesthetic and minimalist design ! Help users recognize, diagnose, and recover from errors
12. Sorting through the data Find a needle in a stack of needles.
13. Affinity Mapping One of these things is a lot like the other…
14. Affinity Map Process Feature 1 Feature 1 Step 1: Write down your discovered features on 3 x 5 cards: Step 2: Organize your cards based on “affinity”. Feature 1 Feature 4 Feature 3 Feature 10 Feature 9 Feature 7 Feature 6 Feature 8 Feature 5 Feature 2 Feature 11 Feature 12 Feature 13 Feature 14 Feature 15 Feature 16 Feature 17 Feature 18
15. Affinity Map Process Step 3: Label your towers Feature 1 Feature 4 Feature 3 Feature 10 Feature 9 Feature 7 Feature 6 Feature 8 Feature 5 Feature 2 Feature 11 Feature 12 Feature 13 Feature 14 Feature 15 Feature 16 Feature 17 Feature 18 Label 1 Label 2 Label 3 Label 4 Label 5
16. Screen Map Do you know where you’re going to?
17. Screen Map Process Step 1: Define your “root.” Step 2: Define Secondary Navigation Step 3: Define Tertiary and Remaining pages Step 4: Apply Technical Labels
18. The Wrap up We’re almost done…
19. The WordPress Factor ! Knowing what features matter most before design and development will make choosing plugins & custom coding easier. ! As you find similar projects (photo blogs, corporate sites, etc) you can identify design patterns that will help streamline your design / development ! Performing exercises like Screen Mapping will help define which template files you need to account for.
20. Questions? jim@brts.us @seejimtweet http://www.slideshare.net/jamesbarrett52438174