Designing a New Way to Beat Wall Street

Mike Chen
Minitheory Design
Published in
4 min readJul 11, 2016

In the world of stock trading, financial professionals are often called upon to discover new stocks to invest in. This is called stock screening.

Current tools are expensive. Companies like Bloomberg charge a lot of money for their famous terminal, which cuts margins for smaller players such as hedge fund management companies. Most stock screening tools today are highly technical and only usable by expert users.

Finviz is an example of overly complex tools at traders’ disposal.

Since Global Metrics wants to open up the pro-sumer market, the challenge was to simplify the user interface without making the product simplistic.

Preparing for a Complex Domain

We had previously tackled financial projects before, but we knew nothing about stock trading and this was our biggest challenge for this project. It’s a field that requires specific domain knowledge and we overcame that by immersing ourselves in a one week crash course of YouTube videos, Warren Buffet books and other online articles. Daily conversations with our client also helped a lot to understand a complex domain within a short period of time. We also interviewed a few hedge fund managers to get a feel of their pain points and what we could do to make their experience better.

Designing and Prototyping

When we had a better understanding of what we should be designing, we started by creating prototypes of certain features, beginning with the ones most valuable to the users. For example, in an early prototype we designed a filtering system meant to work well in a responsive web setting. We wanted to test whether users understood the mechanics of how it worked.

This prototype was made using Sketch (wireframes), Invision and Quicktime. We’ve found that making videos is a great way to communicate designs to different stakeholders and teams, especially if you don’t have direct access to them.

Making the video helped to communicate the concept to our stakeholders, but to truly know whether the design is good or bad, we had to test it with real users.

Usability Testing

We’re using Screenflow for Mac, which allows us to record both the screen and the user’s reactions.

Our usability tests were such a crucial step in the process. We found out early on that our menu system wasn’t the most intuitive. Our users couldn’t find what they were looking for because too many menu items were hidden in one button. To account for this, we iterated and made the first-level actions more visible. We also used colour to make the primary action obvious.

By failing early on, we were able to come up with a much more intuitive final interface design.

Experiment: 8-point grids

We adopted many cues from Material Design for this project. For example, I use an 8-point grid system (kudos to Bryn Jackson and Anthony Collurafici) with a 4-point baseline for type. Why 8-points? Well, most screen sizes are divisible by eight, so it makes sense to design in multiples of eight.

Icons sit inside a 24x24 box.
Keylines keep everything consistent and pleasing to the eye.

We were pretty pleased with the results of this experiment. Our designs looked neater and more consistent across the board.

Outcomes

We caught up with our client a few weeks after that project. It’s become standard practice for us to conduct a client retrospective after the project (on top of our own internal retro). We were very pleased to hear that the project hand-off files such as the style guide and prototype saved their developers two weeks worth of effort.

In addition, our prototypes and videos generated an immense amount of investor interest which the client had to stave off – always a good problem to have in our books!

Follow me on Twitter. If you have a new project you want to collaborate with Minitheory on, you can email or visit us here!

_
Mike Chen is a co-founder at Minitheory, a digital design studio based in sunny Singapore. We make software simple, based on how people think and behave.

--

--

Mike Chen
Minitheory Design

Design at ShopBack. ex-Zendesk, Minitheory, inDinero.