How can I make a timeline look good aesthetically?

Which UI options are suitable for a profile or timeline page for a mobile?

  • I'm currently creating a draft profile/timeline page for a mobile taxi booking application as part of a university project. The basic premise behind this is letting users have their own page to keep track of their taxi journeys. Below is what I've designed so far, which I'm not happy with (given that I am an amateur UX designer) so I have a couple of questions which relate to the overall design of the product. Are the icons at 1) and 2) on the UI well positioned? The icon at 1) represents follower count, whereas the icon at 2) represents the following count. I've seen instances where the following/followers count is situated below the profile. Such as this: Is this best practice or should I leave things as they currently are? I've considered making it look like above, albeit with the third box having something like the taxi trip count so far. If I had to go ahead with this, would any further redesigns be necessary? Secondly I want these to be "clickable" in their current state, its quite difficult to determine this right now. Are there any design alterations that can be made to make the buttons appear more clickable? Right now, it seems like they are just hovering in thin air. This icon is meant to represent the number of users you are following - can you tell this at first glance? If not, what would be a suitable icon to replace this with. In my experience so far, I've found that it's easy to find icons for follower count and not for following count. Blank space alert? Is this something I should worry about? Surely this space can be used to better use... I've been thinking about what I could do to make it more purposeful without making it seem like an unnecessary add-on, but nothing has come to mind yet. The timeline gives a list of all the trips made by the user so far, below the trip made, there is details about the taxi firm used, mileage, cost and time. Is there a better way of representing this information - or does it look alright as it is. Home (left) and Search, Find People (right) are located on the top profile page bar. Should these bought in a bit closer - they seem rather out of place. Would the Home button look better on the bottom navbar? Really struggled with this one. I wanted to show notifications would be displayed to the user, and settled with having the "red" dot to the right of the icon. Can notifications be displayed in any better way? Lastly, the user's reputation score is located below the profile picture. However, at first glance I'm not even sure what it does. Any idea how can the representation of this be improved. Secondly, should I change the colour of the star to something me appropriate? The post does seem like a rant, so apologies for that - all I just need is a gentle (or rough) push in the right direction! I've been looking at a lot of the pages at http://www.pttrns.com/, and its helped me get this far. I hope that you'll be able to provide some concrete advice, backed up with some interesting case studies in response to what I've written. Thanks for taking the time to read this.

  • Answer:

    Some of my suggestions: Followers and Following icons are very confusing. I won't mind if you use a bit of text. Important count considering your application is reputation , taxi trip count, then follower and following. Considering your application Taxi Trip count is the very important indicator. You can show the count in a different color like hyperlink , It will make the user feel it is clickable. My natural instinct was they allĀ  were clickable. Blank space is fine if nothing important is there. It is nice. What's on the home page? I like the notification icon you have shown I need details regarding how you are calculating the reputation score

Pratik Mehta at Quora Visit the source

Was this solution helpful to you?

Just Added Q & A:

Find solution

For every problem there is a solution! Proved by Solucija.

  • Got an issue and looking for advice?

  • Ask Solucija to search every corner of the Web for help.

  • Get workable solutions and helpful tips in a moment.

Just ask Solucija about an issue you face and immediately get a list of ready solutions, answers and tips from other Internet users. We always provide the most suitable and complete answer to your question at the top, along with a few good alternatives below.