Storytelling for Cryptocurrency News (2018)

Developed case studies for a financial news site in order to clarify its value proposition and increase subscriptions.

The Original

  1. No clear value proposition – there are many ways to get similar information elsewhere.
  2. The original graphs are too small and don’t make it obvious what happened, when, and what the user can learn from the example.
  3. The study shows a “Learn More” button forcing users to do more work, instead of improving the case study so it does the work of persuading visitors.

To address this, I developed the improved case studies, wrapping the top benefit of the product in a simple narrative with a simple visualization.

Concepting and Collaboration

I always start on paper and get alternative viewpoints from others whenever possible.

I did some rough paper sketches to capture my idea: My collegue (@jlinowski) did his own sketch:

My Solution

A new simple case study looked like this:

I also took the opportunity to show a multi-step scenario that involve both buying and selling:

These were based on my domain research and interview of the business owner, to learn past stories of success.

I designed and wrote 3 strong case studies to improve:

  • Value proposition: New case studies better convey that early info = profit, which is the key benefit of this subscription. All examples are real, dead simple, and recent. The “How To” wording in the headline also helps convey that these sample strategies are repeatable.
  • Visual hierarchy: The diagram is larger to emphasize the importance of this section to a prospective customer and reduce distractions.
  • Usability: I simplified the diagrams and added clear annotations to show what happened, when, and why it’s important.
  • Transparency: Trying to anticipate visitors’ questions, I lead with a consice screenshot of the actual news feed, so it’s clear what info lead to the decision being described.

Measurement

We A/B tested other aspects of the home page redesign. We agreed not to A/B test the case studies, because (1) team agreed it was an improvement (low risk) and (2) testing would impact other business priorities. After our initial engagement the client reached out to create several more case studies, based on positive feedback to the ones we originally launched.

Detailed Fintech UI Concepting & Design (2015)

Optimized content to persuade visitors to upgrade to the paid product and designed new functionality, dashboards, and reports.

Applying User Centered Lens

I helped the client to create a matrix to clarify their target audiences and user needs in Plain English. Here’s an example:

Writing copy samples helps the team refine its message and value proposition. It generates ideas for design. Later it can serve as raw material for headings, labels, and marketing copy.

This eventually evolved into personas focusing on empathy and context:

Product Concepting & Strategy

I helped the client connect their raw business ideas to specific user goals. I asked user-centered who/how/why questions to tease out the core opportunity. It is common for clients to have implicit knowledge that they don’t think to make explicit.

For example, while discussing a screen, I suggested we break users into “buyers” and “sellers”. It turned out “buyer” and “seller” terminology didn’t feature anywhere in the UI, because the clien’t site isn’t a marketplace. However, this language well described the goals of the users.

I sketched  a lo-fi wireframe in real time. It targeted buyers and sellers explicitly instead of saying “Lists of Products”:

Discussions like this lead to new product ideas, different ways of organizing the existing offerings, and different strategies for marketing.

Landing Pages And Calls To Action

I designed a number of landing pages for this client. When they needed to “collect user data”, I helped them reframe this as a user goal i.e. why are they giving their data? When they wanted a page to list some facts about their product, I helped them articulate the value proposition. I wrote copy and organized content rooted in the user’s situation:

Real-Time Sketching & Collaboration

The client and I using screencasts and email to exchange ideas. Then we’d get on a Skype call to sketch the ideas with real-time feedback.

For example, the client had a screen that lacked purpose and consistency:

I improved the information architecture of the screen (it’s value proposition, hierarchy, and clickable items). During the conversation I redesigned the numerical scale and proposed to expand it create a “report card” for all criteria with useful “how it works” insights for the user (useful based on actual comments from users):

Real-time collaboration allowed design decisions to cascade and evolve to create a more useful, cleaner screen that the client was happy with.

Guiding Users Through Complex Processes

Problem: During our Skype call, the client and I arrived at the idea of “generating leads”, something users are currently not able to do using any tool on the market. To get at this info using the site would require multiple steps and reports.

Solution: I proposed to clarify and emphasize this feature by creating a unified step-wise wizard culminating in a practical “Prospect List” a sales person can run with:

I encouraged the client to guide users more. For example, I recommended adding more descriptions and training videos to various complex areas of the site.

Dashboard Concepting

This is a mockup to summarize a financial portfolio. This report gives users details and a key takeaway i.e. a breakdown of their key product buckets plus a single number summary (top right):

The mockup embodied existing requirements but also served as a proof-of-concept for new potential ideas. For example, in this diagram, I included a blue line that compares Product A to a benchmark. This is a way of asking the question visually: Does the user need to compare to a benchmark?

In this concept for a dashboard component, the idea is to see a subset of the data that’s relevant and then act on it directly. I’m filtering data to show only the negative y axis to highlight only the negative events. I’m then comparing it to the equivalent on the benchmark. I’m also detecting the lowest point (worst event) and allowing the user to click it directly:

I created a summary component to  let uses compare current value to the range, and how far it is from the highly probable values (cutting to the key insight instead of a long table with a complex chart):

Divergent Ideation

There are usually many ways to doing something. When I sketch ideas for a concept, I usually diverge to explore many options. I then converge based on what makes most sense and with client’s feedback OR I propose an A/B test.

For example, I tried an upgrade pop-up instead of the full report to persuade users to pay:

Some of our questions explored as separate variations were: Should I tease user with some summary data? If so, what data? Should I show upgrade call to action and input fields on the same page or hide them behind an upgrade link? Should I go with a dark or light motif? What’s the optimal message for the heading? Should I list top benefits or speak with data?…

For the home page, I concepted out different ways to get the user started:

In version B, I proposed a single field with a call to action, an action 90% of users would be interested in. In version C, I proposed instead to let user choose who they are, then show them a tailored message and call to action (Gradual Engagement). In Version D, I proposed showing the user several “I want to …” statements to directly link to user goals… and so on.