I've been doing some research in successful UIs for search results and as a personal project I am trying to build one that is simple, yet elegant.

That has great interactions and a great experience.

How would you improve this UI I made ( Web Prototype )?

Here it is: https://dl.dropboxusercontent.com/u/270523/help/ui.html

The colours and text are just placeholders.

The white box in the upper-left is going to be for any branding or logo. And the green is where the input field that will contain the term the user searched for, which they can delete and type something else for new results without having to go to the main input ( different interface and different page ).

I would greatly appreciate any and all feedback!

  • 1
    Hi INUXIxD. I'm afraid asking for feedback on designs isn't really what this site is for as such questions don't provide any benefit to users other than yourself. We need UX questions where you're looking for the correct, or best answer. – JonW Apr 20 '13 at 9:12
  • @JonW Ah, okay. Apologies, I didn't know. Thank you for letting me know. – IMUXIxD Apr 20 '13 at 10:48

At this point your mockup is too rough for useful feedback. But it's weekend so what the hey...

  • The input field doesn't look like an input field.
  • Add a placeholder text to the input field so I know what to put in, or put focus on it so I can start typing right away.
  • There is no submit button. Even if you're going to search on key-up or something a submit button tells me beforehand how I could use your interface.
  • The exact ranking of search results means very little in most contexts. The big numbers make them look important, but they're not so it's just noise in the UI.
  • The primary identifier (the title) of a result doesn't stand out.
  • Nothing looks like it's clickable. I'm sure I should be able to do something with these results?
  • Also, your CSS is broken.
  • Did you have a look at Google.com? That's pretty simple.
  • true, it is the weekend. how can I make it look more line an input field, adding placeholder text? True, the numbers are just noise. Thank you for helping me relaise that. The title of each result is going to be bold in font-weight while the links are going to be green with an underline on hover. Will that make them stand out better or more? I haven't made anything clickabe yet. How is the CSS broken? Yes, I tried to be inspired some by Google without copying their design. – IMUXIxD Apr 20 '13 at 10:49
  • In regards to making the primary identifier stand out. Do you think being bold is enough or should it also be a better font-size? I, personally, think the bigger-font size might be too much. – IMUXIxD Apr 20 '13 at 11:57
  • what bout something like this? Different typeface for the title, number on hover, link has underline on hover. cl.ly/image/2r1X2J0T0l1d – IMUXIxD Apr 20 '13 at 18:28

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