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

By: Philip SinghApril 5th, 2012 Category: 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!

UI Step 4 750x560 The Greif has launched his eBook, Step by Step UI Design

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.
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://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://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://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.
http://www.sachagreif.com/ Sacha Greif

Just checked it out, that’s so cool!
http://www.sachagreif.com/ Sacha Greif

Huh, didn’t even know about that! Thanks for enlightening me :)
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 :)
http://jarederondu.com Jared Erondu

What’s your twitter handle?
http://jarederondu.com Jared Erondu

What’s your twitter handle?
Pingback: Lessons Learned from an eBook Launch | SachaGreif.com