I'm working on a web application where I have to save a user's info. This form has about 20 fields. This is the format I am currently using: Detail Form


What's the best way to show these fields in a way that any other person on the web can see this profile in less time.

  • In what context are you using the form? Also, I cannot see the entire form in the image you've attached. You can post an external link if you want, rather than attaching the image in the post.
    – rk.
    Commented Mar 26, 2013 at 17:34
  • 1
    I'm a little confused about your question.. Are you looking to design the look/feel of your form now or how people will view it after that data has been provided. Commented Mar 26, 2013 at 19:28
  • @CourtneyJordan Yes you are right,I want how people will view it after that data has been provided.
    – Sunny
    Commented Mar 27, 2013 at 10:56
  • @rk.Here i am showing some fields of the form just for e.g.
    – Sunny
    Commented Mar 27, 2013 at 10:57

5 Answers 5


One nice way is to visually group related items under categories, i.e.,

'Contact Info' => [First Name, Last Name, Email, Address, Phone] 'Work Info' => [Current Title, Specialization, etc.]

You can see an example of this with Stack Exchange user profiles, or the example below:


download bmml source – Wireframes created with Balsamiq Mockups

  • Thanks for this idea but this format again make the form lengthy :-(
    – Sunny
    Commented Mar 27, 2013 at 10:58
  • 1
    True, the form will be lengthy, but the user will be able to visually navigate to whatever information is relevant to them in an efficient manner. The only way to compress the length of the page is to hide information or transform your presentation of it, i.e., figure out a way to change this text into a pictorial representation or something. Commented Mar 27, 2013 at 13:55

It's kind of a wide question to ask, but I'll do my best to answer. User Profiles can be boring, and somewhat displaying information in unnecessary dull lists. This has been the case for many years, until we got social media.

Yes, I know, Social Media isn't the answer to everything - but in the case of presenting my profile thay have made a huge difference. Take a look at any profile page of twitter, facebook or Google+ and you see no boring list (Ok - there are some, but much fewer than before).

My personal favorite is foursquares profile page. Everything is there, packed with data - and still nice to view, easy to grasp - most important first, and so on. If you want to dig into (drill down) to the information - you can.

Take a look at foursquare profile page - and go all in "share with joy, steal with pride"

enter image description here

  • 1
    Thanks for this wonderful concept.I am working on this and i will update you asap :-)
    – Sunny
    Commented Mar 28, 2013 at 6:09

I was also working on such a form with quite a lot of text fields and thus making it an extensive form. This was my solution to it:enter image description here

just imagine your textfields within each dropdown. Hoping this was helpful :)


Show things that of most immediate interest or have the most concise details first. Usually people don't have time to look at everything, so if you provide chunks of information they can digest easily, they will then be able to look at things in more detail if they want to. By hiding some of this content (e.g. have a 'more...' or some switcher to expand or collapse sections) you are doing yourself and the user a favour by letting them decide what they want to see and what is important for them.


Sounds more like a Design question than a UX question.

From a UX standpoint, the page design should serve what users are trying to accomplish on your app and respect the IA, UIUX they experienced so far (on previous page).

From a data perspective, it would make sense to create a relation between the data and its representation. For instance you could present all "User identity" fields as a business card, use a map to show locations -although it might be a pain to implement, etc.

  • It's both a UX and Design question. Design can impact the users experience which I delightfully encounter on a day to day basis. If a page/website is poorly designed then a user can have a negative experience. Yale's Art Department(art.yale.edu) is a good example of poor design and a huge deciding factor in my college education. Commented Mar 29, 2013 at 11:37

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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