The “Greif” has launched his eBook, Step by Step UI Design

The “Greif” has launched his eBook, Step by Step UI Design

Apr 05, 2012 News

When Sacha Greif, a designer and writer based in Paris, launched his eBook last week, it received a lot of buzz. Greif is well-known for his personal blog, designing French startup Sharypic, and his freelance job board startup, Folyo.

His first book is called Step by Step UI Design and covers how to design a user interface from scratch. Greif uses his open-source chat application, Kandan (which is still in development) as an example. In the 43 page book, he outlines every step a designer can take along the way. The entire eBook covers the following topics:

In this eBook, I’ll take you through my process for designing Kandan (an open source chat app) from start to finish. I’ll explain every iteration (including mistakes and wrong turns), and you’ll learn the reasons behind every design choice. It‘s just like watching over my shoulder while I work, except without having to listen to Lil’ Wayne!

After reading a sample chapter, you can grab the book in one of two packages. The “regular edition,” priced at $5.99, comes with the PDF eBook and PNG files. The “deluxe edition,” priced at $11.99,” comes with the PDF eBook, PNGs, and the full-layered PSD. But here’s the thing, there are only 12.7 million copies left! So you better act quickly! You can buy Greif’s eBook on his site.

WE HAVE 5 COPIES! If you’re interested in getting one, leave a comment mentioning your favorite small UI detail!

  • Jalbanese91

    My favorite UI Detail are well designed glyphs. :)

  • Chris Morata

    So many to choose from! My favorite UI detail is using :target to highlight updates made by the user.

    • http://www.sachagreif.com/ Sacha Greif

      Huh, didn’t even know about that! Thanks for enlightening me :)

  • Igor

    Legible and understandable icons. When they have a 1px white hightlight, I’m in heaven.

  • http://www.facebook.com/people/Aakanksha-Gaur/697971582 Aakanksha Gaur

    My favorite UI detail are the default texts that designers choose to put in a search box. This is one thing which is extremely minute, yet is very convenient. Also, if the designers choose to fiddle around with the “Shopping Cart” image on any online shopping site to make it seem seamless with the rest of the page design.

  • http://techopener.com/ Kenan Shifflett

    Favorite small UI detail: When a form field takes focus and its border is highlighted nicely.

  • http://twitter.com/JordanTBlount Jordan

    Favorite UI detail: Subtle Gradients

  • http://jasonhibbs.co.uk Jason Mervyn Hibbs

    I want the book… my favourite UI detail is a state change on a button press, glorious metaphorical feedback.

  • http://twitter.com/alme1304 Alexis Mejias

    Breadcrums!!!

  • Leonardo Avesani

    My favorite UI detail are borders. Can’t get enough of them.

  • http://twitter.com/reckrt Tyler Reckart

    My favorite UI detail would have to be pixel-hinting. I love making lines look sharper, curves perfect, and making the overall product look great.

  • Adam

    UI detail: whilst adding widgets and features is easy, stripping the experience down to its core can be one of the most challenging but rewarding aspects of creating a web application

  • http://twitter.com/jamiebrittain Jamie Brittain

    My favourite UI detail is the shadows and borders that sperate buttons, content etc from the canvas. A nice touch that looks good in the long run.

  • Jaymie Jones

    Mine would have to be the ever so slight 1px colour change on elements such as buttons and borders, users wont notice it.but we do.

    • http://jarederondu.com Jared Erondu

      What’s your twitter handle?

  • http://www.sachagreif.com/ Sacha Greif

    I’ll give my own example: yesterday I was at a Japanese noodle restaurant, and they had one of those small bowls with extra chili for people who like their soup spicy.

    I don’t know if you’ve ever noticed, but the serving spoons for spices are always tiny to prevent people over-spicing their food: the size of the spoon becomes an indicator of the hotness of the chili.

    When you think about it, this is just like making the “delete” button smaller so that people don’t click on it by accident: a good UI can protect users from their own mistakes :)

  • Suhaila Baheyeldin

    My favourite UI detail: well-designed icons. You know, the ones that are clear and simple, and need no explanation. They can make the UI much cleaner without compromising functionality.

  • http://www.facebook.com/people/Oli-Olivier/100002504323667 Oli Olivier

    My favourite UI detail: selection menus. I absolutely love them.

  • Patrick

    my fàvorite ui detail : icon wéel designed

    • http://jarederondu.com Jared Erondu

      What’s your twitter handle?

  • http://yakim.tk Yakim van Zuijlen

    My favourite UI detail: popovers.

  • Kev

    Saw this recently on a trip. If enable airplane mode on the iPhone, the plane icon “flies” from left to right.

    • http://www.sachagreif.com/ Sacha Greif

      Just checked it out, that’s so cool!

  • http://twitter.com/vhgalvao Vítor Galvão

    Favorite UI detail is the subtle color/tone changes. They don’t distract you needlessly, but are usually good enough to differentiate only when you need it.

  • http://twitter.com/johnpalaganas John Palaganas

    My favourite detail on a UI is the typography, it doesn’t matter how great are the details around the UI if the typography does not compliment them.

  • Daniel

    My favorite detail is get your interesting book for free :)

  • Kevin R.

    One of my favorite UI details is in Apple’s iBooks on iOS. If you pull the bookshelf down past the top shelf, an Apple logo is shown “engraved” in the wood above the top shelf. A tiny fantastic detail.

  • http://iamsteve.me Steve

    I like the swipe with one finger on the shelves in iBooks to switch between books and PDFs

  • ilijusin

    Bookmark icon (saved position indicator) in Tweetbot :)

  • http://jimmyking.me/ Jimmy King

    Gmail’s reminder to add attachment before sending an email mentioning an attachment.

  • http://twitter.com/franboud Francis Boudreau

    Tooltips when you fill out a form that guides you!

  • Eli Schiff

    Usability is key, then comes chrome!

  • http://twitter.com/alanroemen Alan Roemen

    My favorite UI touch is clean, user-friendly icons. They always are a nice touch when used correctly!

  • http://www.kevinpruett.com pruett

    I like the fact that the logo is aligned right (as opposed to left), “getting out of the user’s way” and making the app more accessible overall.

  • http://twitter.com/MitchBernstein mitchbernstein

    To be honest, I don’t have a “favorite small UI detail”. It just seems very straight forward, like a first thought. I wish the tabs on top, overlapped somewhat and I don’t think there should be a divider on the right of the search bar. Maybe one thing i do is the arrow that allows you to hide all the stuff on the right. Looks like a WIP coming along quite nicely. A copy of that book sounds cool!

  • https://twitter.com/rasagy Rasagy Sharma

    After changing your password in Gmail (or Facebook), if you enter your old password by mistake, the error message mentions when the password was last changed (Along with a quick link to reset your password). Couldn’t stop smiling when this first appeared!

  • Hanan

    I love when all UI looks smooth and flossy and butons have decent lightening on hovering with mouse, but the most favorite is search bar on apple.com , I love when it moves left when I klick to write something :)

  • Pingback: Lessons Learned from an eBook Launch | SachaGreif.com

List Grid
Load More