designing refinery29's first mobile app, thisam #wudrome2016

55
\ Designing Refinery29’s First Mobile App, ThisAM @JAMESCABRERA #WUDROME2016

Upload: james-cabrera

Post on 15-Apr-2017

124 views

Category:

Design


0 download

TRANSCRIPT

Page 1: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016

\Designing Refinery29’s First Mobile App, ThisAM@ J A M E S C A B R E R A # W U D R O M E 2 0 1 6

Page 2: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016
Page 3: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016

50,000 installs in first month.

Page 4: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016

40,000 active users per month.

Page 5: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016

The Design & UX Process

Page 6: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016

Empathize

Define

Ideate

Prototype

Test

Page 7: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016

Empathize

Define

Ideate

Prototype

Test

Page 8: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016

Find the Opportunity

Tinker (Play around)

Define “Success”

Make Something

Make It Better

Page 9: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016

The Opportunity

Page 10: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016

Re-usability

Page 11: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016
Page 12: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016

Duplicate Experiences

Page 13: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016

Duplicate Experiences

Page 14: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016
Page 15: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016
Page 16: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016

Web Nativevs.

Page 17: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016

Reach Richvs.

Credit: Luke Wroblewski

Page 18: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016

Universal Access

Routine Access

vs.

Page 19: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016

Existing Product

New Product

or

Page 20: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016

or

Live Data

User Test

Page 21: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016

Horoscopes

Page 22: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016

Careers Work

Money

Page 23: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016

8 Things You Need To Know

ThisAM

Page 24: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016

Tinker

Page 25: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016
Page 26: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016
Page 27: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016
Page 28: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016
Page 29: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016

Define Success

Page 30: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016

Repeat App Opens

Completion Rate

Click Throughs

Page 31: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016

Keep the project on-track

Page 32: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016

Make Something

Page 33: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016
Page 34: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016
Page 35: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016

Progress Depth

Page 36: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016

Top Story First

Progress Indicator

Share Button

End GIF

Page 37: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016
Page 38: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016

Repeat App Opens

Completion Rate

Click Throughs

Page 39: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016
Page 40: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016
Page 41: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016
Page 42: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016
Page 43: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016

Make It Better

Page 44: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016

Increase Success Metrics

Make $$$

Page 45: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016
Page 46: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016
Page 47: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016
Page 48: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016

I get excited to open the app

every morning just to see what the

animation at the end is.

Page 49: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016
Page 50: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016
Page 51: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016

Looking Forward

Page 52: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016

Press Image from amazon.com

Page 53: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016
Page 54: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016

Experience on mobile web

cabr.us/bth-v2

Page 55: Designing Refinery29's First Mobile App, ThisAM #WUDRome2016

\Grazie!@ J A M E S C A B R E R A # W U D R O M E 2 0 1 6