Split Flap

Inspiration

We were inspired by physical split flaps to design a finance platform that is interesting and usable.

What it does

We implemented a stock brokerage platform that is capable of tracking live stock prices, stock price history, the latest stock news, and buying/selling shares. The main gimmick of it was that all the data is displayed using a split flap component we created, which emulates both the visual and audio feel of physical split flaps! (https://www.youtube.com/watch?v=cj32w5z81Ak)

How we built it

We built this app in React + Node.js with Alpaca API for all our stock management features.

Challenges we ran into

We were pressed for time as we started at 7pm due to a conflicting event lasting until then (ICPC NAQ), and so had to really push to get a finished product. Additionally, we ran into issues getting audio working in React and needed to optimize our split-flap component due to performance issues displaying hundreds of them on the screen.

Accomplishments that we're proud of

We believe we faithfully recreated the look, feel, and sound of physical split-flaps in a decently performant and usable manner. Additionally, we implemented enough stock brokerage functionality to be minimally usable for managing stocks.

What we learned

We learned that split flaps are very satisfying to watch. We kept getting distracted by watching our app flip between values.

What's next for Split Flap

If we were to work further on this, we would aim to further improve the visuals, performance, and user friendliness of our split-flap component, as well as add more stock analytics and brokerage features.