SkillFlow — Designing a Slackbot
Personal Project, 2015 | User Experience | Duration: 3 months
🐦 @hunterrice20
Problem
I was seeking to build a deeper foundation for my web development capabilities, and like any fledgling developer, I turned to Stack Overflow for programming help. For the most part, it served its purpose, but when it came to broader concepts, the deferred Q&A format became limiting.
I approached the best web developer I knew and sought to build a more interactive, real-time solution.
Ideation Process
Exploration
I liked the idea of utilizing the tight knit programming community and hackathon space to build the platform on.
Building on Slack was a natural decision, as it would facilitate integration into these existing communities.
User Persona
Starting in the hackathon universe, we would need to populate the platform with both students & mentors in order for the product to be useful and effective. I developed a basic user persona for each of our target demographics, and kept them close by for reference throughout the UX design process.
Human Centered Design
I attended weekly hackathons, conducting user interviews on both students and mentors. Through these conversations, I discovered a major issue that reminded me of my own.
Exploring new technical boundaries felt comfortable to students when mentors were present, but left on their own, their self confidence would wane.
Solution
SkillFlow is a simple Slack integration that places programmers in real-time chats with experienced developers. It would provide the opportunity to expand the student/mentor relationship to the entire development community.
Want to read this story later? Save it in Journal.
User Experience
Designing for this project wouldn’t require my typical UI/UX skills, as my abilities would be considerably constrained to Slack’s limited capabilities. After researching Slack’s API docs extensively, I began wireframing; breaking down the general experience into 4 parts: Tone, Onboarding, Trigger Words, & Incentives.
Tone
This was my first experiment with conversational UI. SkillFlow would posses the qualities of a formal assistant with friendly tendencies.
More human, less robotic. I utilized a few available Slack features like typing indicators (“SkillFlow is typing…”), and lots of fun emoji usage.
Onboarding
Chat bots were a relatively new trend at the time, so my goal was to keep things clear and concise. I gave SkillFlow a simple introduction via Slack direct message, which included its capabilities and simple examples. This would remain in the message thread for users to refer back at any time.
Trigger Words
Students seeking help would simply type their question and let SkillFlow do the work. My partner implemented natural language processing to accurately source the right mentor.
Students would say, for example, “How do I print to console in JS”?
Mentors simply listed their knowledge using “I know”.
Incentives
Lastly, it was critical to align incentives, so I added a touch of gamification. Each conversation was rated, similar to an Uber ride, and both parties earned points for intelligence and professionalism. A user could see their rank of “Programming Prince 🤴”, and gain motivation to answer questions as they continue their journey to the top.
Takeaway
Ironically, working on a tool to help young programmers develop their skills radically improved my own.
Although in just 3 short months SkillFlow was installed over 20,000 times, it will never replace the struggle of one own’s trial and error that comes with building a product.
