

Ask HN: I can't figure out how to make good UIs. How do I learn? - DaCapoo

A bit of background:
I&#x27;m an 18 year old junior in college studying a dual major in computer science and computer engineering. I can figure out any concept regarding technology whether it be closures in functional programming or understanding advanced cryptography concepts. Despite this, I can&#x27;t seem to be able to objectively look at a user interface I&#x27;ve created and judge its quality; it always seems &#x27;good enough&#x27; for me as I know where everything is in it.&lt;p&gt;What are some resources I could look at regarding design of user interfaces? I understand the people that might use a product I create will not see it the same way that I do; they won&#x27;t have the same expertise and familiarity with it at first site. My goal is to be able to create intuitive interfaces (the best UI is no UI[0]) that most people are able to use without issues and without the dreaded &quot;where do I click to perform this action that I absolutely KNOW should be here?&quot;.&lt;p&gt;[0] - http:&#x2F;&#x2F;www.cooper.com&#x2F;journal&#x2F;2012&#x2F;08&#x2F;the-best-interface-is-no-interface
======
glasstongue
A good beginner book is "Don't make me think".

If you want practical advice, I would say look at what you are making, find
existing projects that have similar functionality to what you are trying to
make, take lot's of screenshots of them, put them all in a folder then note
what works and what doesn't, and use it to plan your design.

When you have a minimum viable product (hopefully you've planned a little bit
so you don't have to restructure everything) put them side by side and pick
your own work to bits.

It's easy to lose sight of what you are trying to do if you don't take breaks
while designing especially if you are new to this. You can end up making
something really weird if you don't take your time and try to push it all out
in one go. Allow your brain time to digest what you are doing in in the
background while you do other things.

Other helpful tips:

Combine actions as much as possible without being confusing. If you have a
flow that is 3 or 4 pages/actions long for a mechanism that is relatively
simple - you dun goof'd. I like to aim for one CTA per action but I will
settle for two, three if the action is relatively complex (but all cases are
different - there are no rules).

Spacing and consistency make things look polished - it's 'not important' as
far as functionality goes but it goes a long way for making people want to use
your product. It also gives subtle clues as to the pattern or template they
should follow to get to the next action. As in: if the CTA button is usually
at the bottom but then for some reason it shows up in the middle or the top
you are breaking the 'shape' the user expects to encounter while progressing
through your app or site or whatever.

Same for text entry fields, buttons, or text fields - unless you have a good
reason to change their location, keep similar things in the similar locations,
keep similar mechanisms the same size as each other and have everything act as
consistently as you can.

Keep it simple. If you hand it to someone and they just freeze and ask what
they should do, you need to go back and make it more clear.

------
vitovito
I switched from development into design because of Jef Raskin's book, "The
Humane Interface." It's a design book for engineers, explaining things in
terms of usability and ergonomics and metrics, instead of aesthetics. Those
are things about "good UI" that you _can_ measure.

Then I also recommend people read "The Non-Designer's Design Book," by Robin
Williams. It covers the basic principles of page layout, which are also the
same basic principles of screen layout: presenting the most important
information as best as possible and getting rid of everything else.

Good UI design is good design first, and UI-specific second.

Design is also not art: design has testable goals, has a specific purpose, to
get someone to understand something, to help them execute a task. You have to
test your UIs with actual users and then update them based on the feedback you
receive. Book like "Designing for Interaction" or "Sketching the User
Experience" will include parts about getting good information up front, and
then validating the UI you've designed after (or you can get more pragmatic
and read "Interviewing Users" and then "Remote Research" which will leave out
the "how to design the UI" bit in the middle).

At some point, you will need to get into the visual design of your UIs. I
can't help you with this so much; I stay mostly on the research and high-level
design side. But, David Kadavy's "Design for Hackers" seems to get around
okay, so that might be a good start.

This other comment by ctbeiser also has some good recommendations from a
different perspective:
[https://news.ycombinator.com/item?id=5199409](https://news.ycombinator.com/item?id=5199409)

------
hardwaresofton
Test on real people. While you can imagine/pretend to be a consumer all day
and theorize on the things people will expect, watching real users interact
will be much more accurate

~~~
officialjunk
And record both the screen and the user's face, after disclosing they are
being recorded, of course. You aren't going to notice or remember everything
and having video is also helpful to discuss with others involved in the
development of the product.

------
meerita
A good read would be "The design of everyday things" by Don A. Norman. It
explains how brain works, and how to design by using map techniques and user
tests.

A resume, when design:

1\. Use both knowledge in the world and in the head. 2\. Simplify the
structure of tasks. 3\. Make things visible. 4\. Get the mappings right. 5\.
Exploit the powers of constraints-Natural & Artificial. 6\. Design for Error.
7\. When all else fails, standardize.

There's a lot of books in the matter of UI but they can fall either in the
philosophy side or either the personal taste of the writer.

[http://www.amazon.com/Design-Everyday-Things-Donald-
Norman/d...](http://www.amazon.com/Design-Everyday-Things-Donald-
Norman/dp/0465067107)

~~~
fleclerc
And Don Norman has a new (and free!) MOOC on Udacity on that very same topic:
[https://www.udacity.com/course/design101](https://www.udacity.com/course/design101)

I have the same problem with UI. I am more of a technical person but would
like to get better at design and layout. When I visit some of HN members' web
sites I am always amazed at the way they look: clean and polished. I just wish
I could do that kind of stuff! I will take the Udacity MOOC for a start.
Thanks to other members for their suggestions on this thread.

~~~
meerita
UI is pretty technical design. If you want to learn more about the aspect of
it, the best thing you can do is learn design basics, typography, for example
would make a big impact on your design work.

------
gus_massa
I recommend all the post of
[http://www.joelonsoftware.com/](http://www.joelonsoftware.com/) in the
section “Software designer” (down, in the middle of the page).

The first article is “Controlling Your Environment Makes You Happy”:
[http://www.joelonsoftware.com/uibook/chapters/fog0000000057....](http://www.joelonsoftware.com/uibook/chapters/fog0000000057.html)

In particular, as some other comment said, sit someone (anyone) and look how
s/he use the software with minimal (without) instructions. Put your hands
behind your back and try to be as quiet as possible. Fix the problems and
repeat, preferably with another person.

------
clockwork_189
This is probably one of the most helpful UI resources I have ever stumbled
upon across the Internet: [https://hackdesign.org/](https://hackdesign.org/)

They go through design from the basics to how you could apply it to websites,
mobile devices, etc. I still find myself returning and perusing through the
chapters.

