- Graeme Fulton
- Project date
- June 2015
- IBM Design Thinking, User Research, Usability Testing, Prototyping, Wireframing
- Balsamiq, Adobe CS, WordPress, PHP, JS, HTML, CSS, Sketch App
IBM developerWorks Recipes is a developer-focused, user-contributed, step-by-step tutorial website that explains how to create IoT and IBM Bluemix applications. You can find recipes to learn how to build apps using the latest devices, or even contribute yourself by sharing your own project to help other community members.
This project was carried out over the course of a year, within two phases:
An initial beta version was borne out of an IBM Design Bootcamp studio project using IBM Design Thinking over the course of 2 months within a team of 5 designers. The process included user research, empathy maps, personas, usability testing and prototyping (low-fi to hi-fi).
Creating a production version of the beta site. This second phase involved redesigning the beta version with increased emphasis on user experience and ease of use through user testing.
User centric goals
A hobbyist developer can create and share high quality tutorials (recipes) for an end to end IoT solution, which can be easily understood and built upon.
A hardware partner can contribute quick-start tutorials to showcase their device capabilities, and help customers get set up quickly.
An IBM consultant can up-vote, or sponsor a recipe to increase exposure of valuable and credible content within the community.
- Graeme Fulton, Danny Skinner, Suzy Willis, Edmund Chow, Sam Winslet
- Design Lead
- Steve Haskey
The whole design process was an iterative one, with each part revisited to be validated with further research, user testing and insights gained from stakeholder meetings.
- After user research, we generated three personas who would be using the product we were designing, and explored them using tools such as empathy maps to gain a full understanding of the characteristics and motives of our users:
- These personas were further validated with user interviews and questionnaires.
User Stories & Scenarios
- We explored As-is and To-be scenarios, and created user stories to understand and convey user journeys and analyse the most significant pain points that we could solve with our product.
Wireframing & Prototyping
- After ideation sessions, we created and tested ideas by building them into prototypes based on user feedback.
- This involved lots of whiteboarding and discussion as we moved from low-fidelity prototypes to higher fidelity once our designs had been validated.
High Fidelity Prototyping
- After full involvement by every team member in the earlier parts of the project, this was stage where each designer was able to use their more specialized technical skills.
- Designers with more visual design experience created hi-fi mockups using tools such as Adobe Creative Suite, whilst I created the more interactive coded prototype.
- We worked collaboratively side by side to ensure the coded prototype matched visual mock-ups.
Prototype to production
Redesigning and rebranding the IoT community for a production environment.
- Graeme Fulton, Katy Monaghan, Shaun Lynch
- Design Lead
- Steve Haskey
Phase 2: Redesign
After successful playbacks and positive feedback from the initial prototype created during the studio project, our team was then separated to work on new projects. However myself and design lead Steve Haskey continued working on the IoT community as a side project, eventually recruiting new team members from around the studio to help see the prototype through to a finished product.
UX designer Katy Monaghan joined to lead the user experience of the site, and Shaun Lynch joined as a visual designer whilst I balanced development work with assisting Katy on the UX.
- Katy highlighted problems with the user journey, and ran a workshop with me to address these issues
- We worked together to come to a shared understanding of the goals of the community, and from there we refined the taxonomy and interface of the site:
From here we sketched new ideas, revisited paper prototyping and moved through to high fidelity interactions whilst testing on users:
- Whilst Katy analysed user feedback and did further testing, I worked on the high fidelity interactions such as animations and image loading which were also tested on users:
- IBM developerWorks Recipes was launched on the 29th of July, and the story was picked up by over 35 tech news sites.
- To date the product has been a great success with over 100 high quality IoT Recipes published by the developer community helping customers get started with IoT development and IBM Bluemix.