Satori.com
What is Satori?

Satori is a technical infrastructure to allow Machine Zones, Game of War players from all over the world to communicate in real time. 
Goals and Opportunities

Redesign a codebase portal into an inspiring, easy to use, developer site that will help drive specific users into creation of new applications that work with real time data.
My Role

• Design a developer focused user experience 
• Create a new look and feel and restructured the information architecture
• Test and presenting research
• Inspire and inform
Whiteboarding and Heuristic evaluations

• Evaluate current product
• Hueristic evaluations and interviews 
Map the current landscape
Initial stakeholder interviews were consolidated and we affinity mapped the most important areas we thought the developer portal should focus on.
Personas
After the affinity mapping process we began to group into the Personas we wanted to focus on. We kept them high level as we knew there would be various sub-personas. The focus was on the Hacker/Cloud Engineer, Innovation technologist, The Coder, and The innovation officer.
Competitive Analysis documentation
I created documentation on competitors and presented findings to our dev and product team.
(value props, onboarding flows, strengths and weaknesses)
Home page / Sidebar help documentation specifics
Design consisted of various updates 
Map contextual onboarding

• Maximize working space
Sidebar for documentation needed space.

• Document break points
Site needed to be re-architected in order to achieve design goals.

• Create specifications for front end dev
Tabbed interface. User could click the tab and get contextual help. And or Search.

Map contextual onboarding

• Developer user experience
New user experience needs to be more intuitive and inviting.

• Move dev through project setup
Contextual sidebar help should changes based on what the user should do next. 

• Easy navigation if steps skipped

Tabbed interface. User could click the tab and get contextual help. And or Search.
Sidebar specifications

• How does it interact
When does it appear, disappear?

• What options should be available

Help tab shows when a user is selecting different areas of the portal. 
Before

• Confusing starting points
We found that developers wanted to dive into documentation and start a project first. In our current design it was disaggregated.
• Non scaleable framework
Non responsive, no room for help documentation unless opening a separate window.

• Dashboard data unclear

News and areas where developers could get inspired to build.
• Non inspiring
Developers did not have ideas on what to build, lacked inspiration.
After

• Main use cases prominent
Top main functions shown across the top.

• One click access to view SDK’s and sandbox
One click access to download and code views, prior they were buried.

• Inspiration and news
News and areas where developers could get inspired to build.

• Live analytics
Analytics dashboard of their current apps that they are working on, designed to work above the fold on a laptop and responsive.
Samples of full style guide created
High level walkthrough
For full site and login visit: www.satori.com
Back to Top