← back to projects

IBM developerWorks Recipes

Posted on July 29th, 2015 by Graeme

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.

Design Process

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.

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.

User centric goals

  • 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.

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.

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.

User Journey

  • 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:

User testing

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:

Press release

  • 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.