4

Let's say you have a table that shows you how much a meal voucher is worth at a dining hall at a certain time, so like:

Meal Time               Equivalency Rate
7:30 a.m. – 10:45 a.m.  $5.00
10:46 a.m. – 4:45 p.m.  $7.00
4:46 p.m. – 7:30 p.m.   $9.00
7:31 p.m. – 2:00 a.m.   $7.00

I want to display this data as efficiently (not necessary completely) as possible in one line at the top of a website I'm creating. I think that the primary situations people will use this are:

1) Checking the value before they make in the immediate timeframe ("I'm hungry, what can I get right now?")

2) Checking the value for a purchase they will make soon ("Can I get more value if I wait a few more minutes?")

I don't want to display this as a table, because it doesn't mesh well with the design. What's the best way to do this? I'm thinking something like:

"Equivalency Meal: $5.00 until 10:45 AM, then $7.00."

I've also considered this, taking into account scenario 2:

"Equivalency Meal: $5.00 for the next 45 minutes, then $7.00."

But this feels clunky and hard to read. I've been messing around and this is the best I can come up with. Note that there will be a live updating clock next to this message.

Improve this question
1
  • 6
    Try a horizontal timeline, with each time period following one another. The width of the period will indicate the length of the period, so it will be easier to scan than just words. Add a marker that indicates the current time. And put an emphasis on the current period (like a green color). Above, you can add some text: current discount, and time before next period.
    – jgthms
    Commented Mar 9, 2014 at 11:05

2 Answers 2

Reset to default
1

What's the main objective you want to reach showing these data? Satisfy only the 1) and 2) from the user pov or eg. pushing sales during a specific time of the day, make sure that a lot of user order their meals in the meal time zone?

If any of this make sense for you, my approach would be only to display the minimum amount of information for the current time .

  • right now your included meal value is $5.00.

If the user falls within eg. 30m time from the next 'meal time zone' you can add:

  • hurry! order before 7.30 pm to have a included value of $9.00

or

  • wait! you can have a better deal if you wait until 4.45 pm and have an included value of $9.00.

Not sure about my copy here, but I hope you've got what I mean.

Improve this answer
0

Why don't you use a horizontal bar with gradient fill ranging from a shade of green to a shade of red (with green indicating higher equivalency rate and red indicating lower equivalency rate. And, have a timescale with ticks overlaying this bar with an indicator at the point that indicates current time. Something like this (excuse the crudity of the image):

enter image description here

To make things simpler you can also add another x-axis of time and have the current time mentioned atop the slider handle like (09:20).

Improve this answer

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.