Take the 2-minute tour ×
Graphic Design Stack Exchange is a question and answer site for Graphic Design professionals, students, and enthusiasts. It's 100% free, no registration required.

I have a mobile app interface with a list of dates and notes:

  • Sep 5 - No longer contagious
  • Sep 6 - Can return to school
  • ...
  • Sep 9 - Back to normal

Right now I am using an ellipsis to indicate a gap in days, or time passing between notes. The problem I'm seeing is that this is commonly used to indicate that the user can tap for "more" info, and users are trying to do this. I see problems with other icons as well:

  • Clock: indicates time itself, not a span of time
  • Hourglass: indicates waiting

What can I use to illustrate the passage of a few days time?

share|improve this question
3  
A little down arrow? –  Lauren Ipsum Oct 9 '13 at 17:27
    
That honestly might be the ticket –  user15890 Oct 9 '13 at 18:02
    
I think the problem is that anything that looks like an icon will look like a button and will have people trying to tap on it. Has to look like background structure if you don't want people tapping on it - more in updated answer below. –  user568458 Oct 17 '13 at 13:55
    
You could also play with some form of grouping. Where events that have less than 24 hours between them are closer to each other and then after a 24 hour period if you do something again it'll create a new group. In between groups your could use a border, horizontal rule, different title, etc. –  Johannes Oct 17 '13 at 19:03

3 Answers 3

Something like this maybe?

enter image description here

or this

enter image description here

or this

enter image description here

the "Timer" icon may also reflect time span

enter image description here

Just the ideas...

By the way, I would not recommend to indicate the exact amount of time by the icon, like: 1h, 1d, 2d, etc. The graphics should only represent the meaning, like "passed time".

share|improve this answer
    
The simplicity of the final one works for me stylistically. Maybe if it were using the same graphics as the greeny/blue orb it'd be perfect. –  Dan Hanly Oct 17 '13 at 14:10

Edit: Re-reading this, particularly that the problem is users trying to tap for more info - any icon is likely to look like a button that can be pressed. Icons almost by definition are intended to attract attention and look like something functional: whereas you want something that looks like background.

So given that, I think it has to look like a joining line - background and structure, not foreground. How about something like

[NOTE]---|-|---[NOTE]---|---[NOTE]---|-|-|-|-|---[NOTE] 

...but where the vertical lines (one for each day passed) are very thin and close together so there's not too big a gap?

The principle behind this suggestion is: to carry information but not look like a button or interaction point, it has to carry information while looking like part of the background structure - not foreground. It has to be something people glance past, not something people are drawn to look at directly.


Original answer: if it was okay for it to look like an icon (therefore, potentially like a button)...

Since you're specifically looking at days, there are two common conventions you can use:

  • Something often used in films, TV, comics etc to signify passing days: crossing off days on a calendar, mixed with...
  • ...that common, familiar type of calendar icon (taken from the Noun Project):

enter image description here

...but of course you need to make it clear that it's the passing of days that is the focus, not the calendar itself. You could draw a calendar so the calendar itself is clearly recognisable but background, and crossed off days are the foreground, something like this:

enter image description here

Depending on how much space you have, you could potentially have different icons for smaller and larger amounts of time passing:

enter image description here

...but don't get carried away! Keep it simple.

share|improve this answer

enter image description here

![you can try this type or stop clock type or Bell like icon..but present it like notclickable..i will come under the way u presented...

share|improve this answer
    
This has a very cyclical connotation, I think –  user15890 Oct 9 '13 at 15:41
    
How do you present an icon as non-clickable on mobile app? –  Johannes Oct 17 '13 at 19:00

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

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