I was hired by Bioharmonic Technologies to craft a landing page for Vibrophile, a vibrational immersive music platform.
1) Share Vibrophile's story in an exciting and clear way 2) Allow customers to purchase a subscription outside of the app
I started the design process by building a style tile that included fonts, colors, and imagery to get aligned with the client on the thoughts and feelings he wanted to evoke.
Fonts & Colors
I chose a squared-off techy font for the header (Baj Jamjuree) to evoke a futuristic feeling, which I contrasted with a clean and humanistic Source Sans Pro for the body text.
I was inspired by patterns of waves, vibrations, and various geometric representations of sound. This ultimately evolved into images of stars and galaxies based on the client's feedback.
I built low-fidelity wireframes in parallel with the style tile. Starting from the top of the page, I paired a big hero shot of the app in action with a clear call to action button. Under the fold, I illustrated three key value propositions, followed by social proof validating the client, and a breakdown of the differences between each subscription tier.
I designed the final mockups in Figma and implemented a responsive website in Webflow. The project's biggest challenge was supporting paid subscriptions because the app builder we used (Good Barber) did not offer in-app purchases. I solved this problem by creating a custom payments solution with Stripe Checkout.
69k App Page Views
11k App Sessions
Some text here
1. Keep it simple
Reducing the amount of information to what is absolutely essential enhances the user experience.
2. Clear language always wins
Writing even more approachable language is one area the website has some room for improvement.
3. Stripe works well for app subscriptions
Stripe Checkout was an effective workaround for not being able to use in-app purchases.