UX/UI Workshop: Prototyping magic

  • Published on
    12-Apr-2017

  • View
    820

  • Download
    3

Embed Size (px)

Transcript

  • Prototyping magicUX/UI Workshop:

    October 2015

  • Westtech Ventures x Goodpatch

    UI/UX Workshop: Prototyping MagicAGENDA

    2

    BORIS

    INTRO

    UI PROTOTYPING

    MINDSET

    - Design Thinking- Divergent vs Convergent- MVP vs MLP

    PROCESS

    - Goodpatch Design Process

    - Importance of milestones

    TOOLS

    JAN

    DESIGNER - DEVELOPER COLLABORATION WORKFLOW - Concept stage- Wireframing- High-res Designs- Pixel-perfect

    TRANSPARENT COMMUNICATION

    TOOLS

  • Westtech Ventures x Goodpatch

    Boris Milkowski,Managing Director, Goodpatch Berlin

    INTRO

    3

    boris@goodpatch.com

    At Goodpatch since July 2013

    - Masters in Media Design, Keio University, Japan

    - CEMS Masters in International Mgmt,

    University of St.Gallen, Switzerland

    Previous companies:

    Deutsche Bank, Puma, Filippa K, Porsche

  • GOODPATCH

    Intro

  • Westtech Ventures x Goodpatch

    Team at 4 years anniversary on Sep 1, 2015INTRO

    5

  • Westtech Ventures x Goodpatch 6

  • Westtech Ventures x Goodpatch

    A UI Design Company at heartINTRO

    7

    Beyond platform or device, the user interface is what

    you interact and ultimately fall in love with.

    Intuitive and beautiful design is our specialty.

    UI Design UX Design Strategic Design Development

    Through iterative prototyping and relentless user tests, we identify all parts of the user

    experience.

    All for the wow!

    By matching organizational capabilities with genuine needs,

    we help you make the right product decisions. We love to be

    involved from the start.

    What sets us apart from other design firms is our ability to

    make design reality. From web to iOS and Android, we have

    amazing engineers on both the front-end and back-end.

  • Westtech Ventures x Goodpatch

    2 StudiosINTRO

    8

    TOKYO BERLIN

  • MINDSET

    Prototyping Magic #1

  • Westtech Ventures x Goodpatch

    Stanfords ME310(2011- 2013)

    INTRO

    10

  • Westtech Ventures x Goodpatch

    What is design thinking?MINDSET

    11

  • Westtech Ventures x Goodpatch

    MINDSET

    12

    What is design thinking?

    human-centered innovation

  • Westtech Ventures x Goodpatch

    Divergent vs convergent thinkingMINDSET

    13

  • Westtech Ventures x Goodpatch 14

  • Westtech Ventures x Goodpatch 15

  • Westtech Ventures x Goodpatch 16

  • Westtech Ventures x Goodpatch 17

  • Westtech Ventures x Goodpatch

    Divergent vs convergent thinkingMINDSET

    18

  • Westtech Ventures x Goodpatch

    Divergent vs convergent thinkingMINDSET

    19

  • Westtech Ventures x Goodpatch 20

  • Westtech Ventures x Goodpatch

    Divergent vs convergent thinkingMINDSET

    21

  • Westtech Ventures x Goodpatch

    What is prototyping?MINDSET

    22

  • Westtech Ventures x Goodpatch

    PrototypingMINDSET

    23

    Important: The goal of a prototype is not the actual prototype.Its all about the learning.

  • Westtech Ventures x Goodpatch

    PrototypingMINDSET

    24

    Learning: - Cans need grip Slippery when wet> Matters to athletes as to seniors- Unique haptics can be fun for user- Identified opportunity space: Packaging - Further investigation in packaging and manufacturing

  • Westtech Ventures x Goodpatch

    ChallengeMINDSET

    25

    But how can we make sure we learn?

  • Westtech Ventures x Goodpatch

    Key to learning: DocumentationMINDSET

    26

    Tool tip:

    We also use

  • Westtech Ventures x Goodpatch

    MVP vs MLPMINDSET

    27

    MVPMinimal Viable Product

    A Minimum Viable Product is that version of a new product which allows a team to collect the maximum amount of validated learning about customers with the least effort. Eric Ries, Lean Startup

    > validated learning

  • Westtech Ventures x Goodpatch

    MVP vs MLPMINDSET

    28

    MVPMinimal Viable Product

    A Minimum Viable Product is that version of a new product which allows a team to collect the maximum amount of validated learning about customers with the least effort. Eric Ries, Lean Startup

    MLPMinimal Lovable Product

    It s better to build something that a small number of users love, than a large number of users l ike.

    Sam Altman, Y Combinator

    > validated love> validated learning

  • Westtech Ventures x Goodpatch

    MVP vs MLPMINDSET

    29

  • PROCESS

    Prototyping Magic #2

  • Westtech Ventures x Goodpatch

    Goodpatch Design Process - OverviewHOW WE WORK

    31

    GO

    OD

    PATCH

    DESIG

    N PRO

    CESS

    OVERVIEW

    Goodpatch applies its own design process which leads us through every project.

    It all starts with identifying Problems Worth Solving, followed by a team building with the client in form of a design kickoff.

    Through prototyping we develop the initial Minimal Lovable Product (MLP).

    Good software is never done and this is also how we imagine our client relationship while continuing working with you towards product vision,

    beyond the first launch.

  • Westtech Ventures x Goodpatch

    Goodpatch Design Process - Before LaunchHOW WE WORK

    32

    BEFORE LA

    UN

    CH

    GO

    OD

    PATCH

    DESIG

    N PRO

    CESS

  • Westtech Ventures x Goodpatch

    HOW WE WORK

    33

    POST LA

    UN

    CH

    Goodpatch Design Process - Post Launch (Here the real work starts)

    GO

    OD

    PATCH

    DESIG

    N PRO

    CESS

  • Westtech Ventures x Goodpatch

    ChallengePROCESS

    34

    Projects always take much longer. How can we deliver on time?

  • Westtech Ventures x Goodpatch

    Challenge: How to deliver on time?PROCESS

    35

    - Choose public release dates with important external events(Promised App Store Feature, Speaker engagement, Scheduled Press article)

    - Internal Deadlines to freeze features (Cold Features)

    - Schedule enough QA time for internal bug fixes (Never not needed) - Schedule dedicated bug fixing time after release (Never not needed)

  • TOOLS

    Prototyping Magic #3

  • Westtech Ventures x Goodpatch 37

  • Westtech Ventures x Goodpatch 38

    With Prott we have developed a prototyping tool to help designers better communicate their design with their team from first idea to pixel perfect in a fast and easy way.

  • Westtech Ventures x Goodpatch 39Prototyping as communication

  • Westtech Ventures x Goodpatch

    # UsersPrott

    40

    1st Anniversary

  • Westtech Ventures x Goodpatch

    1 yearTools

    41

    1st Anniversary

  • 42

    IDEOFrog

    ustwopivotallabs

    Pinterest

    Futurice

    Reaktor

  • Westtech Ventures x Goodpatch

    Key take-aways:

    43

    - Divergent phases are followed by convergent phases

    - Prototypes are all about learning, learning comes from documentation

    - Prototypes help you better communicate your ideas

    - MLP is when you build something a small amount of users love

    - External events help you achieve deadlines

  • Goodpatch Design Process

    PRESENTED BY

    boris@goodpatch.com