Get homemade iPhone design sketchbook 4 free


iPhone-Sketchbook_02-ui-designAs an iPhone developer I have learned that it is wise to make the first steps in planning and designing a new iPhone application with a pencil on paper. It is feeling even more natural to sketch an idea by hand instead of creating complex GUI with Photoshop. The classical way of designing also supports the creative process.

Thanks to the test at TUAW I met some helpful tools for designing applications on paper. But there are two problems: First they are not easy to get for a German developer (today I had to fetch my Notepods at the customs duty office), second they don’t meet my demands.
So I’ve created my own sketchbook templates to fit my needs. And I’d like to share it with you.

I’ve created four parts to plan and design an iPhone application:

  1. feature list with ToDo to collect all necessary features for an app and to decide, which feature is a must have, a nice to have or should be developed already for version 1.
  2. A page to design the UI with the original dimensions of the iPhone.
  3. A page to design navigation bars and the UI with iPhone Stencil Kit by Design Comission and also the app icons.
  4. A navigation flow chart to plan the workflows within the app.

Feel free to download the ZIP-Archive (4.4 MByte) of my iPhone Sketchbook and tell me, what you’re thinking about it.

Share

About these ads

11 responses to this post.

  1. Posted by Hanno on 2009/10/27 at 14:13

    wow, pretty cool Andreas.
    I will use it! For sure. :-)
    CU @ vieda :-)

    Reply

  2. Tolle Vorlagen!

    Wäre es möglich, dass Du ein paar ausgefüllte Vorlagen/Sketches einscannst und im Blog präsentierst? Ich denke, das wäre sicher hilfreich um zu sehen, wie man die Vorlagen effektiv einsetzt und außerdem interessant für andere Entwickler.

    Reply

    • Das ist natürlich eine gute Idee … allein, mir fehlt leider der Scanner ;-)
      Im Grunde genommen ist es aber ganz einfach:

      zu 1.: Hier wird einfach wild darauf los geschrieben, welche Features in die App sollen. In den hinteren Spalten macht man jeweils ein x, ob das Feature ein “must have” ist oder ein “nice to have” und ob das Feature bereits in der 1. Version beinhaltet sein soll.

      zu 2.: Auf dem Blatt kritzelt man freihändig die GUI und entwickelt diese zeichnerisch.

      zu 3.: Hat man sich Screens/Views unter 2. erdacht, kann man mit 3. Navigation Bars und Views mit dem “iPhone Stencil Kit” von Design Commision in schön zeichnen. Außerdem gibt es noch unten einen kleinen Space für das Designen des App-Logos per Hand.

      zu 4.: Das ist ein normaler Ablaufplan, mit dem man sich aufzeichnen kann, wie der Ablauf der einzelnen Elemente zueinander ist. Man kann in die Kästchen entweder die jeweilige View in klein kritzeln oder aber nur einen Text schreiben. Durch das Matrix-Schema ist man auch nicht so beschränkt wie bei normalen Flussdiagrammen.

      Tut mir leid, dass ich nichts zum Vorzeigen habe :-)

      Reply

  3. Social comments and analytics for this post…

    This post was mentioned on Twitter by Dr_Touch: Get our homemade iPhone design sketchbook (PDF) for free: http://bit.ly/37nys2 (#design #iphonedev #gui #sketchbook) (via @derheckser)…

    Reply

  4. Posted by Alessandro on 2010/05/08 at 18:52

    Thanks Andreas! I will follow you more constantly!

    Tchus!

    Reply

  5. Posted by Tyo on 2010/08/23 at 15:47

    Great stencil Andreas.. just downloaded it and will use it :)

    Reply

  6. Posted by Edwin on 2010/11/25 at 20:40

    Great stencil !!!!! LOVE IT!
    THANK YOU!! Andreas.

    Reply

  7. Posted by Olga on 2011/05/27 at 21:47

    Very useful! thanks!!

    Reply

  8. Posted by serdarc on 2011/09/28 at 12:51

    This is just wonderfull thank you so much for sharing this stencil!

    Reply

  9. Posted by lentheman78 on 2012/04/18 at 09:27

    Danke! I will try to use it as well

    Reply

  10. thank you,
    From Japan

    Reply

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

Follow

Get every new post delivered to your Inbox.

%d bloggers like this: