48
Great UX Portfolios Its all about the story! Mary Wharmby UX Design Director, Spring Studio @marywharmby www.marywharmby.com Presented to Tradecraft September 16, 2014

Great UX Portfolios

Embed Size (px)

DESCRIPTION

A quick and easy primer for designing great UX portfolios.

Citation preview

Page 1: Great UX Portfolios

Great UX Portfolios Its all about the story!

Mary Wharmby!UX Design Director, Spring Studio!!!@marywharmby www.marywharmby.com

Presented to Tradecraft September 16, 2014

Page 2: Great UX Portfolios

UX Portfolios… the pain

Page 3: Great UX Portfolios

Why so hard?• Portfolios are personal

- its difficult to talk about yourself • You’re being judged

- the audience is vague and complex • The stakes are high

- job, career, lifestyle are on the line • Our work is often intangible

Page 4: Great UX Portfolios

So, yikes! Where do you start?

Page 5: Great UX Portfolios

When in doubt, trust the process• Apply our biggest go-to UX designer master tool: UCD

- UCD is the best way we know to solve design problems

- Applying UCD will help make the design process feel less personal taking some of the emotional charge out of it

• TREAT YOUR PORTFOLIO LIKE ANY OTHER PROJECT

Page 6: Great UX Portfolios

Loosely sequenced UCD process

1. Discovery 2. Strategy and Concepts 3. Interaction / UI Design 4. Testing and Iteration 5. Visual Design 6. Development & Deployment

Page 7: Great UX Portfolios

DISCOVERY

Page 8: Great UX Portfolios

Know your audience• Search and analyze job listings

- What level of skills, experience and education are they looking for?

- How do they describe jobs?

• Talk to your mentors and colleagues

• Go on informational interviews

Page 9: Great UX Portfolios

Who are you competing with?

• Research other’s portfolios

• Whats good and what's bad about them?

• How can you stand out?

Page 10: Great UX Portfolios

Discover the possibilities

• What's cool?

• What might set you apart?

• What tone do you want to set?

Page 11: Great UX Portfolios

STRATEGY & CONCEPTS(the hard part)

Page 12: Great UX Portfolios

Who are you today?

Page 13: Great UX Portfolios

Who do you want to be tomorrow?

Page 14: Great UX Portfolios

Your identity may include…ux generalist

(soup-to-nuts design)

specialist (ux research, ia or gamification)

ui designer

designer/developer

entrepreneur

speaker

manager

strategist

educator

organizer

service designer

visual facilitator

a start-up person

an enterprise person

“special” expert

Page 15: Great UX Portfolios

…a mix of specialtiesux generalist

(soup-to-nuts design)

specialist (ux research, ia or gamification)

ui designer

designer/developer

entrepreneur

speaker

manager

strategist

educator

organizer

service designer

visual facilitator

a start-up person

an enterprise person

“special” expert

Page 16: Great UX Portfolios

…and will evolve over timeux generalist

(soup-to-nuts design)

specialist (ux research, ia or gamification)

ui designer

designer/developer

entrepreneur

speaker

manager

strategist

educator

organizer

service designer

visual facilitator

a start-up person

an enterprise person

“special” expert

Page 17: Great UX Portfolios

Develop an overarching strategyManage your identity across multiple channels !

• publishing • blogging • speaking • competing • teaching

!

Determine how each channel supports your overall identity

Page 18: Great UX Portfolios

Then, set specific portfolio goals

• Support professional brand • Get work seen • Get jobs • Find clients • Network • Receive contacts

Page 19: Great UX Portfolios

Some of the content is a given…

• Skills • Experience • Work examples • Education • Downloadable resume • Contact form

Page 20: Great UX Portfolios

But, UX is different

Page 21: Great UX Portfolios

UX has to demonstrate fuzzy skills• Problem solving skills • UX and UCD process skills • Storytelling in both images and words • Big picture thinking • Detailed thinking • Critical thinking • Ability to work with complexity • Ability to think outside the box (creativity)

Page 22: Great UX Portfolios

Thinking: the “invisible” skill

• How do you show thinking?

• Its invisible but you can see evidence of it all around you

Page 23: Great UX Portfolios

Approach 1: Case study

• Usually considered the best approach

• Shows a number of projects

• Traces the entire process from discovery and problem identification to solution (and maybe implementation)

Page 24: Great UX Portfolios

Apply a strong narrative• Problem

• Process

• Solution

• Results*

• Your Role

Page 25: Great UX Portfolios

“Show” the story with evidence• Show, don’t tell

• Include detail but don’t force me into it (options)

• Provide the “why” for each step (what did you learn)

• Highlight pivots and evolution of thinking

• Keep it brief and to the point

Page 26: Great UX Portfolios

Approach 2: Design process• Useful if you don't have complete projects or NDAs prohibit

a full case study approach

• Show process and problem solving but its more generalized (not grounded in a single project)

• Describe each process step and why it matters

• Show examples of deliverables from each stage

Page 27: Great UX Portfolios

That process may look like this

1. Discovery 2. Strategy and Concepts 3. Interaction / UI Design 4. Testing and Iteration 5. Visual Design 6. Development & Deployment

Page 28: Great UX Portfolios

Add something about you!• What’s your story?

• What do you care about?

• What do you love to do?

• What makes you unique?

• What are you looking for?

Page 29: Great UX Portfolios

SKETCHES & WIREFRAMES

Page 30: Great UX Portfolios

UX/UI is usually fairly simple• Create an information architecture (sitemap)

• Define your navigation scheme

• Remember everything you already know about usability:

- Make it easy to find

- Be modular (easier to update)

Page 31: Great UX Portfolios

TESTING & ITERATION

Page 32: Great UX Portfolios

Get it in front of people• Show mockups of your site to colleagues and mentors.

• Get their advise on your narrative, presentation, etc.

• Make changes.

• Rinse and repeat.

• Its worth the time to get something really good

Page 33: Great UX Portfolios

Apply basic usability practices• Is it scannable? 60 second test

• Can I find something specific quickly?

• Are you resonating with the right audience?

• Is your resume downloadable?

• Are you easy to reach? (contact form not an email link)

Page 34: Great UX Portfolios

VISUAL DESIGN

Page 35: Great UX Portfolios

Don’t compete with yourself

• Keep it clean and simple

• Remember the site design is a framework for your work

• Put time into making your work examples look good

Page 36: Great UX Portfolios

DEVELOPMENT & DEPLOYMENT

Page 37: Great UX Portfolios

Lots of optionsSquarespace

Coroflot

Behance

Carbonmade

Dribble

Page 38: Great UX Portfolios

Work on your offline presence

• Maintain a more detailed set of case studies or examples to use during interviews

• Be ready to take a large audience smoothly through your work

• Show-and-tell is a good thing

Page 39: Great UX Portfolios

NDA Junction

Page 40: Great UX Portfolios

NDAs• Follow the NDA

• A few techniques to show limited views of the work

- Blur/box out names and sensitive content

- Show a cropped detail that removes crucial context

- Keep it small and provide just a flavor of the work

- Create a fictional project to showcase similar work

Page 41: Great UX Portfolios

BEST PRACTICE RECAP

Page 42: Great UX Portfolios

Mary’s Top 101. Make your portfolio part of a larger brand strategy that

spans channels and communities

2. Know your audience (research, networking)

3. Show your thinking (show evidence and results)

4. Tell a good story (strong narrative)

5. Make it visual (show, don't tell; document everything)

Page 43: Great UX Portfolios

Mary’s Top 10

6. Less is usually more (be selective)

7. Be honest (everyone starts somewhere)

8. Keep it simple (don’t compete with your own work)

9. Get personal (tell us about yourself)

10. Stay fresh (keep your identity up-to-date and evolving)

Page 44: Great UX Portfolios

RESOURCES

Page 45: Great UX Portfolios

A few examples

UX Portfolio

User Experience Design Portfolio of Simon Pan

Edmund Yu - UI/UX Design Portfolio Seattle

Brian Plemons / Designer

Page 46: Great UX Portfolios

Resources

Five Indispensable Skills for UX Mastery

betteruxportfolios | Portfolio tips for UX professionals

How to wow me with your UX portfolio

10 Tips for a Better UX Portfolio — Medium

The UX Portfolio: Top 10 Questions for UX, UI & Visual Designers

Page 47: Great UX Portfolios

Image Credits• Pain https://flic.kr/p/gSBKuk

• Deer https://flic.kr/p/nE2H4

• Audience https://flic.kr/p/2XuJbH

• Competition https://flic.kr/p/auoXPH

• Inspiration https://flic.kr/p/5VcbTv

• Toolbelt https://flic.kr/p/4fSezm

• Bulldozer https://flic.kr/p/53YCtb

• Craftsman https://flic.kr/p/71fq4J

• Different https://flic.kr/p/4ob8eT

• About you https://flic.kr/p/nnL5Y9

• Stop https://flic.kr/p/cM1FCS

Page 48: Great UX Portfolios

Thank you!

Mary Wharmby!UX Design Director, Spring Studio !!@marywharmby www.marywharmby.com