ARROW.COM
PROJECT:
Arrow.com
CLIENT:
Arrow Electronics
AGENCY:
The BIO Agency
DATE:
01/2015 – 07/2015
SKILLS:
Competitor Analysis & Benchmarking
Omnigraffle Wireframing
Axure Prototyping
Usability Testing & Analysis
LINK:
SUMMARY
The BIO Agency worked in collaboration with Arrow to redesign and build their entire e-commerce site (B2C & B2B) and platform from scratch. I joined the project shortly after kickoff, working in a team of 3 permanent UX designers with occasional freelance support.
My involvement was across the entire site but principally on the integrated collaborative web-app that connected to the client’s existing online design tools to allow for team-based project work. This involved co-designing with the client’s in-house panel of field engineers, preparing and running user testing and liaising with design and development teams.
THE PROBLEM
Arrow is one of the largest electronics component distributors in the world, with a varied but highly specialised product range and a demanding clientele of both consumer and business customers. With no clear class-leader in the industry, The BIO Agency was tasked with creating a digital experience that would become the home of electronic engineering on the web.
In addition to the core e-commerce experience, Arrow were keen to build a suite of tools to support their engineering users. Our challenge was to discover and define how we could best help arrow engineers to collaborate and solve the problems they encounter when using Arrow products.
USER RESEARCH
Though I have an engineering education, my knowledge of professional methodologies and workflows was limited. Fortunately, we had remote access to a panel of Arrow engineers who were keen to share their experiences and opinions.
To get the most out of this resource we created stimulus material for a series of online workshops. These revealed that engineers struggle with innovative product ideas and with finding and collaborating with experts in specific cutting-edge fields of technology.
These project areas were fed back to client and a stakeholder co-creation workshop was held. Design opportunities were identified and mapped back onto this experience map. One suggestion that came out of this session was for a collaborative project space for engineers to share material and designs.
Working closely with the client’s product owner I started to sketch out a shared project space called “My Projects/Design Center”.
WIREFRAMING
A decision to work desktop-first was taken, as in all likelihood this area of the site would get relatively little mobile traffic. The initial research we had conducted with the panel of engineers revealed that design work invariably takes place in the context of supporting research and on a desktop computer.
The sketches were taken into Omnigraffle and iterated. A project search facility was added and mobile and tablet viewports were designed up as this was to be a fully responsive site.
USER TESTING
The designs were taken into testing, with the aim of both testing the proposition and validating the design. All tests were conducted in-person and moderated. These revealed issues with labelling and some of the minor controls and interactions. The ability to duplicate a project was added and project search was descoped for MVP.
HANDOVER
The finalised designs were then taken into UI design and a modular pattern library was created for client handover. During the course of development, we provided support to clarify and simplify any issues found during build.