Panony Mobile Media App

The go-to media app tailored to crypto investing

The app strives to assist experienced crypto-investors collect enough information to make their investment decisions. With the two features, investors can be on top of every crypto information they wish to know!

Crypto Dashboard

In the Crypto Dashboard, investors can follow different crypto info pages and receive their information updates! The information on the info page is gathered from multiple sources.

So now, investors don't need to visit all over the place to look for information. They can turn on their notification and get a comprehensive look at the crypto!

Close-up →

Article Shortcut

Article Shortcut is a tab where investors can store related (or interested) articles together for later reading. The swipe-up gesture of the tab allows investors to go back and forth between the articles quickly without exiting the article.

Now, to compare multiple articles, investors don't need to interrupt their reading repeatedly. They can hoard articles together and then read!

Close-up →

The challenge I was given

Adapt the news website into a mobile media app
to help investors source information before investing

More and more investors are investing in blockchain startups through their mobile phones. Hence how easy it is to source blockchain-related information on their mobile phone becomes more crucial than ever.

To cater to this on-the-go investing, I helped Panony adapt its news website into a mobile media app that fits blockchain investors' information sourcing experience.

The research process

Unravel what is complicating investors’
information-sourcing information on mobile

Investors' information-sourcing experience through desktop news sites is utterly different from that of mobile news app. The variations exist in user's preferences and expectations due to the mobile app's on-the-go characteristic.

Hence I directed the research towards both how users source information and how users decide based on the information on their mobile phone.

Who are the investors →

I synthesized the bulk of insights into two overarching pain points that can serve as guidelines for future design. These two pain points are the problems that Crypto Dashboard and Article Shortcut strive to solve, respectively.

Further, the two pain points represent the first two and the latter two steps of the user journey (from the previous paragraph).

Insight 1 from "Know" and "Collect" steps

Information of Cryptos Scatters across Platforms

Vincent centers his search around cryptos. He usually thinks of the crypto and then the information about the crypto. However, crypto information is scattered across different apps, so Vincent has to switch from app to app, page to page, to gather them.

Insight 2 from "Validate" and "Collect" steps

Comparing Information on mobile is Troublesome

Vincent tends to read extensively to validate the credibility of a piece of information. However, the process is cumbersome, especially on mobile, since it requires him to select the articles he is interested in and then compares them.

Design Process

Design the functions around insights
synthesized from the user research

I ideated several ideas from the 2 insights from the user research and narrowed them down to 2 solutions: Crypto Dashboard & Article Shortcut.

In the design process, I have the insights as guide to materialize the interface of the two functions. The process is as follows.

How is the ideating process →

Insight 1 from User Research

Crypto Dashboard

For the Know and Collect steps, users are struggling from getting information from different places. At this stage, they center their search around cryptos, they are extremely skeptical of information, and they continuously check information updates.

Step 1 Information Architecture:

How to showcase the crypto and the content of the crypto on the dashboard

I came up with two options for the layout of the Crypto Dashboard, and did a QOC analysis to figure out which fits Vincent's mental model more

I decided to go for the one not stacking all content together (startup-centered) since it fits investor's mental model of first the startup and then the relating information.

Step 2 Content:

What information is needed and how should they be laid out

I went back to users and realize the three types of information that is deciding: Official Announcement, Articles from Opinion Leaders, and Reports of Incidents. And I double checked with my editor-in-chief of our constraints.

For the layout for each type of content, I designed them to combat users' skepticism toward information.

Step 3 User Testing:

Testing the mockup with users to improve the experience of the Crypto Dashboard

I ran 2 rounds of user testings. During the testing, I asked them to demonstrate tasks and I observe and do post interviews. Several design changes are made accordingly.

Task 1
Follow a startup that you think is "investable"
‍
Change
From putting the search button at the end of the swipe bar (the left mockup) to fixing the search button at the right of the swipe bar (the right mockup).
‍
Reason
Users tend to go back and forth to different pages while performing the task. Some users also mentioned potential problem of following too many cryptos hence need to scroll all the way to the end

Testing 1: Before

Testing 1: After

Task 2
Gather enough information for making investment decisions
‍‍
Change
Linked the title of the startup's profile page with their basic information
‍‍
Reason
Users are not only skeptical of the information of the crypto but also the crypto itself. They also want some basic information of the crypto.

Testing 2: After

Insight 2 from User Research

Article Shortcut

For the Validate and Decide steps, users are trying to compare articles on their mobile phones. At this stage, they like to hoard articles and read all of them together. When reading, they switch between articles a lot. When realizing that they need more articles, they go back to the Collect step, which can complicate their reading flow.

Step 1 Layout:

The method of saving articles to the Article Shortcut.

I came up with two options and did a QOC analysis to decide which one to adopt. During the process, I strived to fit the layout with Vincent's experience while thinking of comparing the currently-reading article with another.

Step 2 Flow:

Streamline the user flow of Article Shortcut according to Vincent's experience in comparing articles

The user flow of the Article Shortcut includes two parts: Adding articles to the Reading List & Saving the Reading List to the Shelf. For each part of user flow, I made wireframe and mockup. Further I took the mockup to Vincent to test if there are frustrations within the interaction.

Takeaway

Clarify Users' Mental Models and Center the Design Around Them

Across the process, I spent a lot of time contemplating what the users are trying to do and what their instincts are. I felt this helpful for my further design since I can have a clearer mind of how to center the design around users!

For instance, while coming up with the mobile app's information architecture, I was able to realize users' critical need for information. Hence I decided to set the mobile app's first tab to be of users' urgent need: check the startup updates. This approach that's totally different from the news website helps users quickly get their needs nailed and can communicate to the users that this is the exact app they need!

Ambiguity is Spicy Food!

I love spicy food. First sight, the hot mess might get you a bit worried. However, as the spicy kicks in, your body starts to generate endorphins, which gets you addicted (scientifically proved🤓), you start sweating, and you can pass through it and feel just good!

At the beginning of this project, the company handed me this vague task with no known constraints. Since we are a startup, I have to build up the product concept, test it, and design it on my own. This freedom leads to vagueness, which I know can lead to unlimited opportunities. Like I always like to bring friends to have spicy food together, I collaborated with my teammates, and we ended up getting addicted together!