User Experience Stack Exchange is a question and answer site for user experience researchers and experts. Join them; it only takes a minute:

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

I usually have a hard time designing a good UI for my applications/websites (especially the websites).

Are there any tricks to this? Are there good books that can help/guide me? Or libraries eg. NetAdvantage or template creators that can help with this?

In the case of web development is there a really good UI design tool like Microsoft Expression Blend I can use to develop the layout?

share|improve this question

closed as off topic by Rahul Mar 12 '12 at 10:32

Questions on User Experience Stack Exchange are expected to relate to user experience within the scope defined by the community. Consider editing the question or leaving comments for improvement if you believe the question can be reworded to fit within the scope. Read more about reopening questions here.If this question can be reworded to fit the rules in the help center, please edit the question.

That's what visual designers do. UXDs focus on making that "beautiful" design usable. – dnbrv Mar 10 '12 at 22:18
Are you talking about usability of the interface? or the visual quality of the interface? – DesignerGuy Mar 10 '12 at 22:21
Both, I think however good the quality can be it should be usable. – Chibueze Opata Mar 10 '12 at 22:22
This question is off-topic, please see the FAQ, notably the section "Your questions should be reasonably scoped. If you can imagine an entire book that answers your question, you’re asking too much." – Rahul Mar 12 '12 at 10:33
My recommendation, especially in the beginning: Keep It Simple – Svish Mar 13 '12 at 8:53
up vote 4 down vote accepted

Tricks? Not really. Like any other handcraft this too requires time, focus and hard work to master the required visual-, interaction- and user experience design skills to deliver above average products.

That said these are some great reads, the 1st more theory focussed (must read primer), the 2nd much more practical focussed. Together they will give you a good kick start!

The Elements of User Experience by Jesse James Garrett
Smashing Book #2

Good luck and have fun!

share|improve this answer
Hmmm, order two books to get a good kick start? I was hoping to hear what you use yourself? Pure design with photoshop using some graphic design knowledge etc. – Chibueze Opata Mar 10 '12 at 22:55
@opatachibueze: Photographers have a saying, "The best camera is the one you have on you". In other words, it doesn't matter what tool you use as long as you know the craft & the tool. – dnbrv Mar 10 '12 at 23:18

The trick is analysis, testing, and experience. The design should first and foremost be informative and accessible, and (this is important) relevant to the purpose of the product. Before deploying a design, usability testing can be done to identify problems. Last, keep trying; make small single page mockups by hand or using any tools you'd like to try out to become familiar with a good workflow.

I highly recommend doing wireframes before starting on the visual layout and coding the front end. Doing wireframes by hand is not uncommon, but as for software, any tool that can draw basic geometric shapes should do.

For building websites, after doing the above, I personally like to code by hand, maybe using a boilerplate of framework like HTML5 Boilerplate.

share|improve this answer
HTML5 boilerplate looks very interesting. Thanks for the link! – Chibueze Opata Mar 10 '12 at 22:53

There really are no shortcuts. As the others have mentioned it comes with experience. One thing I started doing is using Evernote to clip websites that I am particularly attracted to. It has become a pattern library of sorts that I can refer back to. I also found the Non-Designer's Design Book helpful.

share|improve this answer

If you're asking for tips to cut some corners, you can't really, IMHO. You will have to look at the complete design spectrum.

But do have a look here, you should find it helpful I think:

In terms of tools, wireframe with any tool you prefer (I prefer illustrator but that's because I already have it in my fingers) but start on paper. For the actual design I'd stick to photoshop. Especially the upcoming version CS6 is going to be excellent; it will have document wide text-styling (think CSS) and layer search/filtering.

share|improve this answer

Not the answer you're looking for? Browse other questions tagged or ask your own question.