Top Banner
DESIGN AT YOUR STARTUP KIM DOWD & NINA MEHTA
44

Intro to Design w/ Pivotal Labs

Aug 11, 2014

Download

Design

500 Startups

 
Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
Page 1: Intro to Design w/ Pivotal Labs

DESIGN AT YOUR STARTUP

KIM DOWD & NINA MEHTA

Page 2: Intro to Design w/ Pivotal Labs

KIM DOWDProduct Designer

User ResearchInterface DesignVisual DesignProduct Strategy

Page 3: Intro to Design w/ Pivotal Labs

NINA MEHTAProduct Designer

User ResearchInterface DesignVisual DesignProduct StrategyMarketing & Media

Page 4: Intro to Design w/ Pivotal Labs

Design is making thingswho, why, how

Page 5: Intro to Design w/ Pivotal Labs

DesignersDefine DropshadowsRun A/B TestsKnow Entire ProductFind User GoalsSummarize FindingsTry Many OptionsDefine Your BrandMake PrototypesDraw DiagramsTake Photos

Talk to usersPropose LayoutsWrite CodeSketch FeaturesCreate ScenariosMake MoodboardsDraw IconsWrite CopyPick ColorsChoose Fonts

Page 6: Intro to Design w/ Pivotal Labs

Startup Design Process

Stanford d School

Ideate

Empathize

Define

Prototype

Test

Page 7: Intro to Design w/ Pivotal Labs

Designers at startupsadvocate for your users

Page 8: Intro to Design w/ Pivotal Labs

Talk to usersin person

Page 9: Intro to Design w/ Pivotal Labs

Leave the officeGo where your users are

Page 10: Intro to Design w/ Pivotal Labs

Defining the next featureThis topic is huge.

But basically, its a mix of - listening to users - watching users - strongly defining your value props - knowledge of an effort/value ratio - sense future landscape

Page 11: Intro to Design w/ Pivotal Labs

How to create a featureScenario based design, testing, building

Page 12: Intro to Design w/ Pivotal Labs
Page 13: Intro to Design w/ Pivotal Labs
Page 14: Intro to Design w/ Pivotal Labs

Choose a featureYou have expertise in your field. You’ve used that to make a product. You want to make a new feature, based upon user requests, your knowledge in the field, new research.

for example

“Make it easier for users to view many photos”

Page 15: Intro to Design w/ Pivotal Labs

Be specific: Who & What & Why“Make it easier for a tween to view imagessimilar to the one she is looking. If she sees many images she likes, she will come back.”

Page 16: Intro to Design w/ Pivotal Labs

Be Measurable“Make looking at a new photo easier than clicking the back button or close button for a tween to explore photos similar to her current one.”

“Lower current bounce rate on main photo page by 20%.”

“Raise click through to new photo by 20%.”

Page 17: Intro to Design w/ Pivotal Labs

Who is this Matilda? her needsto feel inspired visuallyto craft an identity based upon “hearting”to connect with similar people

her mediacurrent screen size: every smart phone, tablet, laptop size in the world

her fav thing on the sitehearting something

Page 18: Intro to Design w/ Pivotal Labs

ScenarioA story with people.

Like Romeo and Juliet. Romeo escapes his house through a window.He prances towards Juliet’s houseHe feels inspired by love and hormones. He sees her silhouette through the window. He throws rocks to get her attention.

Page 19: Intro to Design w/ Pivotal Labs

ScenarioA story with people, feelings and data.

Matilda, the tween, searches for photos of flowers.

Thousands of images return.

She is drawn to a trendy one.

She looks at the close up of it, and noting that many other people have “hearted” it, she hearts it as well.

She is quickly able to see close ups of all the images in her search return (thousands) and heart them.

Page 20: Intro to Design w/ Pivotal Labs

Time to sketchpictures of sketches - must dig through and find

Page 21: Intro to Design w/ Pivotal Labs
Page 22: Intro to Design w/ Pivotal Labs

Test against ScenarioLook at each flowSee if it works for the scenario stated.

Page 23: Intro to Design w/ Pivotal Labs

PrototypePaper

Screen based (Pop App, Invision App, PPT, Keynote)

Fast, crappy code

Page 24: Intro to Design w/ Pivotal Labs
Page 25: Intro to Design w/ Pivotal Labs

Quantitative dataGoogle analytics

Mixpanel

Kissmetrics

Crazyegg

Page 26: Intro to Design w/ Pivotal Labs

Quantitative Data

Page 27: Intro to Design w/ Pivotal Labs

Qualitative Responses“I hate this. The images don’t fit on my screen.”

“Soooo much better.”

Page 28: Intro to Design w/ Pivotal Labs

Summing it up:Scenarios & measurable tests1. Create a scenarios that tells a story or usage. 2. Draw a lot crappy designs, to test against the story. 3. Choose a few to prototype quickly. (paper, etc)

4. Test qualitative data against metrics. (20%)

5. Collect quantitative data to test against scenario.

Page 29: Intro to Design w/ Pivotal Labs

Seventh Inning StretchQuestions?

Page 30: Intro to Design w/ Pivotal Labs

Making sense of a complex feature“But this feature a bajillion steps and can takes 8 weeks to process!”

Card sorting!

Page 31: Intro to Design w/ Pivotal Labs
Page 32: Intro to Design w/ Pivotal Labs
Page 33: Intro to Design w/ Pivotal Labs
Page 34: Intro to Design w/ Pivotal Labs
Page 35: Intro to Design w/ Pivotal Labs

Ship early, ship often

Page 36: Intro to Design w/ Pivotal Labs
Page 37: Intro to Design w/ Pivotal Labs
Page 38: Intro to Design w/ Pivotal Labs
Page 39: Intro to Design w/ Pivotal Labs
Page 40: Intro to Design w/ Pivotal Labs
Page 41: Intro to Design w/ Pivotal Labs

Daily scheduleStandupWork with devSketch1 feature at a timeKill the meetings

Monday FixingTuesday Create Big IdeasWednesday Create Small DetailsThursday Make prototypeFriday Test with UsersSaturday Oh Sh*t daySunday (recover)

Weekly schedule

Page 42: Intro to Design w/ Pivotal Labs

Design at startupsHuman CenteredIterativeStructured

Page 43: Intro to Design w/ Pivotal Labs

Go outsideSleep at nightEat your vegetables