Visualization of Cryptocurrencies for Novice Users
By CJ Huang and Arjun Reddy
Blockchain technology has become more and more popular after the emergence of Bitcoin. Cryptocurrency is one of the implementations of Blockchain, which has been benefiting over a 100 million people. However, the majority of people don’t have the chance to get to know this revolutionary technology. Therefore, most people don’t feel safe about it, although security is one factor cryptocurrency users have been advocating. Our motivation was to present cryptocurrency players and dynamics in a consumable and engaging mode.
Goal
Our project’s goal is to present a clear and unique view of the blockchain industry. By providing an interactive visualization of how blockchain plays a role in varied fields, we aim to create a traversable platform for intermediate users to understand better how blockchain implementations play a role in these domains.
Sketching
We looked at the industry category after traversing the block visualization represented by Cryptorank.io and other crypto ranking sources. With the top 1000 companies having different segments in the diagram, we manually tracked these to 52 industry categories. To further narrow our scope we were able to get a dataset for the domain category of currency.
With some help with how the table information displayed the data, we recreated these data points within our first sketch. We created a preliminary sketch (Sketch 1) of how the cryptocurrencies could be mapped using a radial visualization. Aided by the channels of color, position, and depth, our first sketch attempted to use different layers but with each layer visualizing price, net profit/loss (within a time span, for example — 24 hours or 7 days), Market Cap, Volume and Circulating Supply. These features would be mapped according to the central segment, which in this case is currency.
The strength of utilizing a radial map is that they offer a more presentable narrow scope of the data relative to boxed treemaps. Within the scope of each category, we can use the fields of position and depth to indicate multiple points of data for a single blockchain cryptocurrency. However, one of the weaknesses of this type of radial diagram is that more blockchain cryptocurrencies can take up additional segments within the circle. Additionally, there are some major players with significantly larger stats (For example- Bitcoin), and this segment share could affect the amount of information or distort the volume.
We further explored a more organized presentation of the categories in Sketch 2. In this sketch, the base circle is separated by sectors that represent different categories. Every round shape on the base circle is encoded by a dataset of one cryptocurrency. The area of this circle is decided by its Market Cap, whereas the distance from the center indicates its volume. The color of the circle(green and red) shows the positiveness and the negativeness of the price change. This design’s strength is that it shows the whole picture of the blockchain industry at a glance. Yet, the details of each cryptocurrency will not be easily recognized since there would be too many round items on the visualization at the same time.
Drawing from the ideas of Sketch 2 and Sketch 1, we created another sketch (Sketch 3) with a slightly different approach. The radial map would be divided into how many ever cryptocurrencies we choose to filter (in our data set for currency, top 100). The color of the segment would indicate a net profit or loss. For example, if the bitcoin currency has a net positive profit, it would be green. If it’s a loss, it would be indicated in red. The circumference allocated to each segment would be subject to the volume, market capital, or category. On hovering over a particular segment, the segment could expand depending on the visualization. We are also thinking of including a hoverable tooltip indicating the cryptocurrency, its price, volume, circulating supply and net gain/loss.
Beta Release
After cleaning the data to reflect our areas of concern, we played with multiple variables (In tableau) to recreate different types of data visualizations. In doing so, we attempted to connect the variables that showed significant differences in our visualization. We noticed the initial players in the rankings to have a significant distinction from the rest of the currency types. For example, Bitcoin had a substantial distinction from the others when it came to price, volume, and market capitalization. With this in mind, we diverged to create our prototype visualizations using two approaches. The first was to roughly map out our sketch using Adobe Illustrator to capture our data set. This gave us an opportunity to discover what kind of filters might work with the viz and how many data points could be expressed clearly at a glance.
These diagrams were created from the dataset but were produced by hand; they do not accurately represent the data since the entire viz was created manually on Adobe Illustrator. This was a precursor to understanding the contrasting data points and significant differences that existed within our data set. Some of the limitations of this were that only a certain amount of information could be depicted at a glance and that some of the data points were near negligible in contrast to larger data points. This was somewhat reflected in our next approach.
After this, we attempted to reinforce our understanding of the data using Tableau. In Fig 3-Tableau implementation 1, we tried to emulate the bubble-like illustration from Fig 2. The size of the circles represents the market capitalization and the distance from the left shows the volume of each cryptocurrency. Although this implementation strives to reproduce our design, we cannot show all the data points to our readers in one glimpse without scrolling. Trying to make it a radial layout might make the communication more efficient, yet it would also be a challenge for our final release.
We tried to implement the data points in Fig 1 as a stacked bar graph in Tableau. In Fig 4, the orange bar represents the share in market capital, whereas the blue bar stacked on the orange bars shows the volume of each cryptocurrency. Bar graphs are always a preferred methodology in statistics and data viz because they are simple and easy to read. The shortcoming of this visualization, however, is similar to Fig 3 in that the readers cannot see all of the data points at a glance without scrolling to the right because the dataset is too big. Additionally, the currencies with smaller values cannot be seen at all. For example, BAL and BAND aren’t depictable in the graph.
The last implemented data visualization (Fig 5) showcases the volume of each cryptocurrency in one day. The green and red represent the positive and negative price change(±%) as taken from the rough digital illustrations. However, the difference between Bitcoin’s volume and other cryptocurrencies’ is significantly large; hence the readers can’t clearly read the bars of currencies with smaller volumes. We cannot encode both market capital and volume at the same time either.
User Testing
After we conducted our testing with four users, we found out that most users couldn’t grasp the cryptocurrency jargon and terms involved when referring to the legends or viz. The users didn’t immediately recognize the purpose of the data visualization. The users pointed out that we put too many cryptocurrency players in one chart, making it hard for users to understand values and make connections with concepts. To solve these problems, we lay out several updates that we want to do in the next iteration:
- Provide a clearer way to present the legends.
- Clean up data points and make them easier to be differentiated from each other.
- Provide more contexts or explanations for novice users.
- Explain the relationship between market capital, volume, and price in a better way.
Final Visualization
The data visualization presents the market capital and the volume of cryptocurrencies in the bubble charts and the bar charts. With the tab on the top, users can switch between different visualizations — Tab 1 shows the market capital in the bubble chart. Tab 2 presents it in the bar chart. Tab 3 shows the volume of cryptocurrencies in the bubble chart, and Tab 4 is the volume in the bar chart. The data visualization also provides definitions of terms for novice users. The legend describes the color encoding of different cryptocurrencies. If users want to get rid of nominating cryptocurrencies to look at the ones with relatively smaller volumes and market capital, they can take advantage of the visualization filters.
Takeaway
This project gave us a valuable and grounding experience in creating data visualization. We initially tried to add too many channels in one single data visualization, this ended up making the design overbearing and slightly confusing to users. We found that the large difference between dominant cryptocurrencies and others can be a huge factor when trying to design a more readable chart.
