Well this week is different. Andy lets us scrutinise his credit card spending habits, so we’re getting very personal right here. This dataset is nice and small, so simplicity will be my focus for sure.
Of course, no published news article exists on Andy’s credit card purchases, so he kindly posted a couple of screenshots for us from his online account.
What I like about them:
- they’re simple and neat and actually look quite nice at first glance
- the colours in the line chart work well together but are easy to differentiate from one another
- the call-outs add further information and indicate that transactions data can be accessed (‘click to show transaction’) which will be interesting for further exploration of specific data points
- the chart titles are simple but provide enough information to tell me what each chart is about
- the addition of the monthly average line in the second picture is useful
What I don’t like:
- the bar chart separates data into categories through individual bars as well as colours. The colours don’t add any further information and while the colour palette is nice, it doesn’t mean anything to me and seems a bit too much. A single colour would have been sufficient
- the labels in the category chart are too far removed from their respective bars. I would prefer to see the labels closer to the bar because my eyes have to keep jumping from left to right to see the values and relate them back to the length of each bar
- the bars are a bit thin, especially given that each row band is quite wide, so I would prefer each bar to be wider
- for the line chart which shows year-over-year spend, I think the title isn’t sufficient. The chart simply shows the spending levels each month for two different years. The year-over-year % only becomes apparent in the tooltips
What I did:
- I really wanted to keep it simple this week, back to basics, so I did some initial exploring of the data to understand the different fields included
- Then I went to the whiteboard for some sketching…
- As I don’t have a lot of critique for the original line chart, I decided to only do a makeover of the bar chart and create what I think is a better version of it
- I used a single colour for the bars (spending category), kept the labels close together, made them large and provided % of total spend labels rather than $ amounts.
- The $ amounts have moved to the tooltip and there is a short note stating the total $ amount, which I think is interesting to see and to give perspective for the data
- I put the % labels to the left of each bar so it reads naturally, almost like a sentence following the subtitle (What did Andy spend his money on in 2016?): “42% (on) Transportation”. Rather than “Transportation: 42%”
- Because I’m a big fan of alliterations, I used the German word for credit card in the heading. I think it looks almost formal and I like how the black, slim font looks on a warm grey background and how the vertical and diagonal lines of the K’s provide some contrast to the orange horizontal bars and the curves of the numbers
(click on the image for the interactive version)