Victoria Whang | Product Designer
Victoria Whang | Product Designer

Blog

Thoughts that didn’t make the cut on my Medium page

Posts tagged data visualization
Widgets - Currency Counter
IMG_0291.JPG

I recently started taking over one of the walls in our Solar meeting room for user testing screens, UI elements, reports, etc. On today's agenda, we have a new widget for PowerHub Lithium: the Revenue counter widget.

Initial questions

1. What is revenue?
2. What kind of revenue do our users experience?
3. What currencies are applicable for our users?
4. How do our users understand/wish to understand revenue?

Test subjects today

1. Customer Specialists
2. Product team BAs
3. Business Development Lead
4. CEO (via Slack...he's in Montreal today)
5. Front-end Developer
6. Development Lead

I tested five (5) options of revenue widgets and learned from some of the test subjects that revenue can never be negative (-). If there is a loss, we would need a whole other type of widget to account for it and call it something other than "Revenue".

Some of the feedback I received

  • Currency symbol ($) should be very clear and visible
  • Up and down arrows look like how stock market changes are visualized and easy to understand
  • Without currency symbol, it just looks like any number
  • Positive/negative symbols are confusing, as if it's calculated against a baseline and if so, what is that baseline?
  • Some currencies display their symbol after the number
  • Implementation would take longer to display currency symbol next to the number and also have the currency code labelled underneath 
  • Revenue may not always be money, in renewable energy it may be credits as well
IMG_6074.JPG

Next steps

  • Analyze all findings
  • Discuss results with product team
  • Narrow down implementation
  • Move forward with dev for release in the coming weeks :)
Donut Charts - Data Visualization
dataviz.png

Challenge 
To visualize how much time our clients would save by using our application.

Idea 
If we use 100% as their total time working on these four day-to-day tasks, we would save them x amount of time. The graph I use would have to give a sense of time, savings, and usage.

Solution 
A donut chart being a circle feels like a clock and having the arrow go counter-clockwise made this chart feel as if you were going back in time by x%. By using a darker colour for the time still spent and a lighter colour for time saved, it almost makes it feel like we're erasing time spent doing something. Because circles are generally harder to feel out the amount of, I've included the percentage number so that the audience knows exactly how much time saved is illustrated in the charts.

The final product was an infographic for a company blog article. We may also use the donut chart elements for print marketing in the future.

The final product was an infographic for a company blog article. We may also use the donut chart elements for print marketing in the future.