Ronin Chat


I was a Senior UX Designer at Coolfire Solutions which was part agency part SaaS startup. They were working on a new project called Ronin and I was given a chance to design the web experience as well as a sample application that would leverage the technology.

Ronin offered developers a suite of tools to simplify back end development. The plan to increase adoption involved creating a series of sample applications that dove into different features of platform. Our first sample was a chat app which used messaging and sessions to create a Slack like experience.

Design Process

Over the course of a few weeks I worked exclusively with wizard Android developer Brennan Smith. He was the point-man on understanding what Ronin offered and how our app could show it off. I took his guidance for features and mapped those to user flows based on competitive analysis of other messaging tools.

Brennan and I looked at Slack, iMessage, Android messenger, Skype, etc. to get a feel for 1-to-1 and 1-to-many chat interfaces. The user flows and feature lists were negotiated with management to get the seal of approval, then I worked on making a high-fidelity prototype.

I decided to test out InVision's new design tool Studio to see what all the hubub was about. Intantly I was very impressed - I was able to animate the log in flows as well as some delightful conversation browsing interactions very quickly. The rest of the design experience, however, was garbage.

Animated prototype of chat application


Brennan and I were able to deliver a great sample app in record time. The demo app is live and available for download from Github. I also learned a new tool, and also realized that while Sketch wasn't as flashy with animation - it was a far superior design tool. Oh well.

Sign in flow

Creating new threads

Chat details

Finding chat channels

Channel mentions and details