World of Progress Bars: From Pizza to Fundraising

9 Uses of Progress Bars

Everyone has seen progress bars, but these simple tools are often overlooked and not given the credit they deserve! The first progress bar was invented by  Karol Adamiecki in 1896 when he developed the Gantt chart.   Later it became popular in computing to show the progress of a task, such as a download or file transfer.

Progress bars are one of the game mechanics often used in gamification, so we’ve highlighted some examples of progress bar usage out there, and explain why it works or doesn’t work!

#1 Take-out

With Domino’s progress bar, customers can track the status of their pizza and know when it’s on the way. This bar also saves Domino’s time and money from having to answer unnecessary customer calls.

 Aesthetics:

  •  Drawings are a nice touch, but images could be animated for more engagement
  • Style of drawing doesn’t communicate quality

Functionality:

  • Innovative concept to apply progression bars to pizza, and eliminate unnecessary customer calls
  • To improve the functionality, there could be a countdown clock and specific times for each stage so customer knows how long it will take
  • When the pizza is out to delivery, it should show the delivery car en route to the customers’ house

.

#2 Shipping

This shipping service allows customers to track the progress of their packages, which alleviates customer worries and builds trust.

Aesthetics:

  • Too much text and not enough visuals
  • A lot of color combinations that aren’t very engaging

Functionality:

  • The countdown clock does its job but it’s so mediocre that it’s not engaging
  • All the information in provided to the user
  • To improve this progression bar, it could show where the package is at in the delivery and when the package status was last updated

.

#3 Blogging

Blogging platforms like WordPress encourage users to engage with the website and show a history of what they’ve accomplished so far.

 Aesthetics:

  • Clean, simple design
  • The progress stands out and the star at the end adds an element of motivation

 Functionality:

  • Motivates the blogger to continue posting by showing goals, and breaks up posts into do-able chunks
  • There’s no reward system in place, and once the blogger realizes this the challenges lose its value

.

#5 Shopping

The shopping progression bar tells the customer how many steps to completion, allows them to backtrack, and functions as a rule book to build trust.

Aesthetics:

  • The colours allow the user to know where they are and which sections they have finished
  • To improve the graphics, the completed processes should change to a colour besides grey
  • Another improvement would be to add icons along with the text for each step

Functionality:

  • To improve the functionality, this site could add a progression bar within each step so the user knows how long it will take to complete
  • It’s not obvious if customers can go back to previous steps or not.

.

#6 Profile Completion

This progression bar shows the user their profile completion for LinkedIn.

Aesthetics

  • Colour is good: clear foreground and background
  • Lighthearted design makes it more casual, and feel less like a chore

Functionality

  • The progress is simple and clear
  • It lets the user know the next step but does not force the user to do it
  • Shows how much of the users profile is completed and how many steps are left
  • Tasks are broken down into do-able chunks and arranged by order of importance

i.

#7  Knowledge/Influence

Social media platforms like Klout use progress bars to show users their influence on specific topics.

Aesthetics

  • Icons are used for topic, level of influence, and profile pictures of friends
  • Text: what is important has a bigger text
  • Design is consistent with Klout’s branding
  • The use of colour is very easy to see

Functionality

  • Progression system is a bit unclear; the user doesn’t know how many K+ he/she needs to complete the bar
  • The topics are given arbitrarily and do not reflect actual knowledge of a topic
  • Klout has an algorithm that tries to determine your influence which adds a personal touch

.

#8 Survey

Progress bars for surveys are used to show the completion of the survey.

Aesthetics

  • Hideous colour scheme: the light green and white is a disgusting combination and hard to see
  • Too much text

Functionality

  • No indication of how long the progress bar is
  • Like that there’s a progression bar in the survey, for more info check out 7 Tricks to Gamify your Survey.

.

#9 Fundraising

Progress bars work for fundraising by showing the user that they can be part of a community of people who have also found this cause worthy. It also shows users that their money is making a difference because each donation helps to progress the bar.

Aesthetics

  • No comment…

Functionality

  • Progress bar does not look functional
  • Not clear how much money has been donated or what the goal is
  • Nice that there is a percentage given so users don’t have to guess

.

.

What other elements of gamification are you interested in?

We want to hear from you!

No comments yet... Be the first to leave a reply!

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

%d bloggers like this: