MOCKDOWN A Visual Language
A FEW STATS...
ONLY 32% OF SOFTWARE  PROJECTS SUCCEED     [1] Standish Group Chaos Summary 2009
64% OF FEATURES ARERARELY OR NEVER USED     [1] Standish Group Chaos Summary 2009
WHY?
COMMUNICATION      & EXPECTATIONS  [1] Standish Group Chaos Summary 2009
GREAT SOFTWARE ISMORE THAN CODE
STOP CODING   AND TALKTO YOUR USERS
USERS CARE ABOUT EASE OF USE.     NOT TEST COVERAGE.
WHERE TO START?Grab a pencil and paper.   Or even crayons.Sketch up your interface and show somebody
BUT THEN WHAT?
THE PROBLEM• Pencil   & Paper gets lost.• Mockups     & Wireframes are difficult to maintain long term.• There’s no good wa...
WHAT IS MOCKDOWN?• Open    source, code-based mockup tool.• Declarative, component-based, visual   language.• Free   as in...
HI-FI MOCKUPSUse prebuilt components to create mockups     or create your own components.
DEMO
THE FUTURE     How to make software design better
MORELIBRARIES    Android jQuery Mobile     WebWindows (Native)Mac OS X (Native)
VISUAL EDITOR
INTERACTIONS
COLLABORATION SERVER   So your stakeholders and users can tell you  that your software sucks before you write it.
STATIC ANALYSISAnalyze your application’s UX with usability rules.
MULTIPLE OUTPUTSPDF, Photoshop, PNG, JPG, HTML, Code Generation
GIT BRANCHINGCreate a feature branch and mockup the feature.               Merge back in later.
IPAD EDITOR Like finger painting but  you get paid to do it.
QUESTIONS?
END
Upcoming SlideShare
Loading in...5
×

Mockdown @ MOB

404

Published on

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
404
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
2
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide
  • - Welcome\n- Introduction\n
  • - Standish Group Chaos Summary\n
  • - Late\n- Overbudget\n- Never delivered\n
  • - two-thirds\n
  • \n
  • - Stakeholders & users can’t fix software until its built.\n- Game of Telephone\n
  • - Developers care about clean code.\n- Users care that it works.\n
  • - Users don’t want to feel stupid.\n
  • \n
  • - Stetching is step #1\n- Show the UI to anyone and get feedback immediately.\n- Walkthrough\n
  • \n
  • - No long term product design solution.\n- No tools integrate with the developer workflow.\n
  • - Resuable - borrow from other mockups\n
  • - lo-fi coming\n- start lo-fi\n- use hi-fi once you understand layout.\n
  • \n
  • - If you had the perfect design tool, what would it look like?\n
  • - Naming component is hard.\n
  • - For designers, UX people, stakeholders.\n
  • - Map out your application.\n- Describe flows.\n
  • \n
  • - EX: No way back home.\n- EX: Font size req for personas.\n
  • - Layered PSD for designers.\n- Device testing.\n
  • - Work with developer workflow.\n- Diffable.\n- Define changes and handoff branch.\n
  • - Walk around and show people.\n
  • \n
  • \n
  • Mockdown @ MOB

    1. 1. MOCKDOWN A Visual Language
    2. 2. A FEW STATS...
    3. 3. ONLY 32% OF SOFTWARE PROJECTS SUCCEED [1] Standish Group Chaos Summary 2009
    4. 4. 64% OF FEATURES ARERARELY OR NEVER USED [1] Standish Group Chaos Summary 2009
    5. 5. WHY?
    6. 6. COMMUNICATION & EXPECTATIONS [1] Standish Group Chaos Summary 2009
    7. 7. GREAT SOFTWARE ISMORE THAN CODE
    8. 8. STOP CODING AND TALKTO YOUR USERS
    9. 9. USERS CARE ABOUT EASE OF USE. NOT TEST COVERAGE.
    10. 10. WHERE TO START?Grab a pencil and paper. Or even crayons.Sketch up your interface and show somebody
    11. 11. BUT THEN WHAT?
    12. 12. THE PROBLEM• Pencil & Paper gets lost.• Mockups & Wireframes are difficult to maintain long term.• There’s no good way to collaborate with product owners, interaction designers, developers & users.
    13. 13. WHAT IS MOCKDOWN?• Open source, code-based mockup tool.• Declarative, component-based, visual language.• Free as in beer & free as in speech (MIT License).
    14. 14. HI-FI MOCKUPSUse prebuilt components to create mockups or create your own components.
    15. 15. DEMO
    16. 16. THE FUTURE How to make software design better
    17. 17. MORELIBRARIES Android jQuery Mobile WebWindows (Native)Mac OS X (Native)
    18. 18. VISUAL EDITOR
    19. 19. INTERACTIONS
    20. 20. COLLABORATION SERVER So your stakeholders and users can tell you that your software sucks before you write it.
    21. 21. STATIC ANALYSISAnalyze your application’s UX with usability rules.
    22. 22. MULTIPLE OUTPUTSPDF, Photoshop, PNG, JPG, HTML, Code Generation
    23. 23. GIT BRANCHINGCreate a feature branch and mockup the feature. Merge back in later.
    24. 24. IPAD EDITOR Like finger painting but you get paid to do it.
    25. 25. QUESTIONS?
    26. 26. END
    1. A particular slide catching your eye?

      Clipping is a handy way to collect important slides you want to go back to later.

    ×