Mission

Code Ocean is a user-generated content platform. Our first goal was to encourage researchers to upload their research code and data. But scientists are not developers. They vary in skills and experience. Some are familiar with professional IDEs and feel confident, some are not. So the onboarding process had to take that into account. 

‍

Design process

• We mapped our users’ journey which consists of 3 main flows: sign up, uploading and testing of code, submitting for publication. We would also need a user dashboard, profile and an explore page that showcase all the published code.
• We compared popular IDEs and learned their designs
• We created a live mockup using Webflow
• We used this mockup to demo the product to researchers and reproducibility advocates and gathered feedback

‍

Solution

We launched our product with a clear empty state to help users understand what's next. An introduction video goes through the whole process from creation to publication, in order to provide researchers the big picture. We added walk me bubbles across the app to provide new users with helpful information at the right time.

Researchers are very careful about what they read and share, so our content had to be professional and valuable. The challenge was to find a way to visualize tech ideas in a classic, editorial manner which is still original and appealing.

We explored a variety of options for the logo, trying to visualize our core values (scientific, innovative and reliable), as well as the ocean theme. Then we developed a graphic language that we implemented to various online and offline materials.