contact us

Use the form on the right to contact us.

You can edit the text in this area, and change where the contact form on the right submits to, by entering edit mode using the modes on the bottom right.

         

123 Street Avenue, City Town, 99999

(123) 555-6789

email@address.com

 

You can set your address, phone number, email and site description in the settings tab.
Link to read me page with more information.

0smarterbear_topbanner.png

Smarter Bear

Encouraging financial literacy, Smarter Bear is a glance-able dashboard for the everyday person. The data visualization serves as a reference point for the public to support their investment decisions.

Smarter Bear was a 6-day project. With our team of four, I white-boarded a timeline and set daily goals.

The U.S. Securities and Exchange Commission website publicly displays when top management and board members of companies buy or sell their stock. Within two business days of buying or selling their stock, a Form-4 is legally required from these top owners of companies to the SEC. Professional investors routinely use this information to support their investment decisions. However, the everyday person does not have access to such tools not to mention it's time consuming to aggregate massive amounts of data, search by individual companies, and observe trends. 

 I led the team in defining the approach we wanted to keep in mind throughout the different stages of product development. This is a great way to ensure everyone is on the same page. Later on if there are differing perspectives these guidelines help realign us and move us towards our vision.

I led the team in defining the approach we wanted to keep in mind throughout the different stages of product development. This is a great way to ensure everyone is on the same page. Later on if there are differing perspectives these guidelines help realign us and move us towards our vision.

 Before designing the look and feel of the product I had each of the teammates specify where on the scale of personality they envisioned the product. This was a great talking point that got our team discussing the identity of the app. We agreed that it was going to be a fairly modern app that was trustworthy since we are providing transparency of financial data, however didn't want it to be too serious or unapproachable. Kept this in mind as we then discussed user needs. We talked with three everyday users and three people that have either traded or have been in FinTech.

Before designing the look and feel of the product I had each of the teammates specify where on the scale of personality they envisioned the product. This was a great talking point that got our team discussing the identity of the app. We agreed that it was going to be a fairly modern app that was trustworthy since we are providing transparency of financial data, however didn't want it to be too serious or unapproachable. Kept this in mind as we then discussed user needs. We talked with three everyday users and three people that have either traded or have been in FinTech.

 

User NEEDS

MVP

Which companies are buying/selling the most stock?

Who are the individuals buying/selling most stock?

What’s going on with a particular company over time?

 

Post-MVP

Should I buy or sell?

How confident I should be about a transaction?

What are patterns over time based on top owners' transactions?

 
 I led the team brainstorm based on the user needs we discussed. All ideas were encouraged as at this stage it helps create boundaries and shape the scope of the product. For instance, one sketch on the bottom right sparked a conversion on how we wanted to be thoughtful about combining emotion and financial data.

I led the team brainstorm based on the user needs we discussed. All ideas were encouraged as at this stage it helps create boundaries and shape the scope of the product. For instance, one sketch on the bottom right sparked a conversion on how we wanted to be thoughtful about combining emotion and financial data.

Explored an interesting concept where companies were in a "universe" and the size of a company was determined by the amount of transactions that were going on. Also discussed another versions of this idea where size of the bubbles were represented by the insiders' transaction amount. Though the universe idea was harder to interpret in a glance, in our final app we used a bubble chart to indicate amount bought or sold at a company over the past quarter.

 In contrast to a bubble chart we also explored the idea of a visualization displaying the top traded companies in grid form

In contrast to a bubble chart we also explored the idea of a visualization displaying the top traded companies in grid form

 We enjoyed the clarity of some of the simplest ideas during the brainstorm, green indicating buy and red indicating amount sold.

We enjoyed the clarity of some of the simplest ideas during the brainstorm, green indicating buy and red indicating amount sold.

 This was an idea I had for the homepage displaying Top Transactions by Company. Relevant news would be displayed on hover to communicate the cause of the high transactions, however during a feedback session learned that that it was too early to display granular information at this level.

This was an idea I had for the homepage displaying Top Transactions by Company. Relevant news would be displayed on hover to communicate the cause of the high transactions, however during a feedback session learned that that it was too early to display granular information at this level.

 This was an attempt to display both buy and sell data at the top level, however post-feedback decided not to go with this idea because once the top company transactions are similar the size of the bubbles would be very difficult to distinguish and gain value from.

This was an attempt to display both buy and sell data at the top level, however post-feedback decided not to go with this idea because once the top company transactions are similar the size of the bubbles would be very difficult to distinguish and gain value from.

 The notion of communicating more concrete information on what's actually going on with a company during high trades was best when presented alongside a individual company's cluster trade chart. From research I learned the strongest signal you can get in insider trading are when there are cluster buys, which is when there is mass insider buying behavior. The scatter plot in the company view page is a way to observe cluster buys. Another signal to keep an eye out is when when middle management buys since it's more risky for middle management to invest significantly compared to senior management. The y-axis of the scatter plot displays the level of insider.

The notion of communicating more concrete information on what's actually going on with a company during high trades was best when presented alongside a individual company's cluster trade chart. From research I learned the strongest signal you can get in insider trading are when there are cluster buys, which is when there is mass insider buying behavior. The scatter plot in the company view page is a way to observe cluster buys. Another signal to keep an eye out is when when middle management buys since it's more risky for middle management to invest significantly compared to senior management. The y-axis of the scatter plot displays the level of insider.

 After exploring a variety of ideas, created wireframes  for the Top Overall Trades, Company Trades, and search. 

After exploring a variety of ideas, created wireframes  for the Top Overall Trades, Company Trades, and search. 

Throughout the 6-day project, I spoke with 3 people outside of FinTech on their approach to investing and received feedback from 3 people that have traded or have worked in FinTech.

 
Usually when people invest they have a hypothesis and you look for data to back that hypothesis. Something that correlates news events to how the market reacted and displaying it in a simple manner might be useful
 
 
 In the beginning of the project we discussed as a team that Smarter Bear should be modern, fast, simple, and accessible. I found a balance between trustworthy and official with warm and friendly elements. The darker blue communicates trust and dependability while the accent colors are warm and approachable. The softer yet confident slab serif is used for the headers paired with it's clean san serif counterpart. The approachable yet smart bear logo gazes in the direction its headed.

In the beginning of the project we discussed as a team that Smarter Bear should be modern, fast, simple, and accessible. I found a balance between trustworthy and official with warm and friendly elements. The darker blue communicates trust and dependability while the accent colors are warm and approachable. The softer yet confident slab serif is used for the headers paired with it's clean san serif counterpart. The approachable yet smart bear logo gazes in the direction its headed.

  Throughout the project we noted future ideas for Smarter Bear. Filtering (last two days, last week,  Insider Purchases $25k+, Insider Sales $100k+) ,   e  xecutive profiles to observe patterns (overall and company specific) and longer-term trends, company to company comparisons, and ideas that we had for observing patterns over time were noted for post-MVP. 

Throughout the project we noted future ideas for Smarter Bear. Filtering (last two days, last week, Insider Purchases $25k+, Insider Sales $100k+), executive profiles to observe patterns (overall and company specific) and longer-term trends, company to company comparisons, and ideas that we had for observing patterns over time were noted for post-MVP. 

 Challenges our team faced was not only learning all the technologies that were new to us but also combining it all together. Data visualization was one of the most important parts of our project. D3's h ighly configurable  nature was very enticing. As we weren't experienced with React, integrating React and D3 together proved difficult. We then looked into Highcharts, it suited our purpose and we were able to integrate it with React. Getting the data was challenging as well. We used the U.S. Securities and Exchange Commission’s Edgar API to retrieve the raw data. First time we seeded our database it took over an hour because it depended on our network connection to the SEC database of raw XML data. Refactored the process to get more current data. First fetched raw XML data then parsed it. We eventually got down to all transactions in 5 minutes. At the end, it was exciting to see our data visually render on page.   http://yourinsider.herokuapp.com/

Challenges our team faced was not only learning all the technologies that were new to us but also combining it all together. Data visualization was one of the most important parts of our project. D3's highly configurable nature was very enticing. As we weren't experienced with React, integrating React and D3 together proved difficult. We then looked into Highcharts, it suited our purpose and we were able to integrate it with React. Getting the data was challenging as well. We used the U.S. Securities and Exchange Commission’s Edgar API to retrieve the raw data. First time we seeded our database it took over an hour because it depended on our network connection to the SEC database of raw XML data. Refactored the process to get more current data. First fetched raw XML data then parsed it. We eventually got down to all transactions in 5 minutes. At the end, it was exciting to see our data visually render on page.

http://yourinsider.herokuapp.com/