Engine Yard
During 2013 and 2014 I worked at Engine Yard, a cloud application management platform, on a rebrand. The work encompassed every aspect of the business from ads to the product to technical documents.
Project Management, Research & Analysis
I project managed, co-designed and co-built the award-winning new website. Part of my job was to educate and lead the team of marketers, designers, managers and copywriters on a user-centred design and development process.
I created a project plan for the redesign and ensured each team member was on track. The process was broken into business research, user research and iterative solution building. During the research stages I conducted user testing, interviews, reviews and analysis to create internal strategy documents to communicate findings to team members, our VP’s and C-level execs.
Once we had a clear direction I created user flows, user stories, job stories, information architecture, personas, wireframes, prototypes, high-fidelity mock-ups, illustrations and production-ready HTML/CSS and javascript.
Information Architecture
To help team members visualise the structure and relationships, I created a simplified information architecture with inbuilt flows which allowed us to simplify the structure as we were able to see how individual sections would lead elswhere in the sites and how information was related.
Because the Engine Yard product is so complicated I championed a narrative approach to describing what Engine Yard does. Focusing on the benefits to the user rather than having lists of disembodied features.
Once the underlying structure was clear I moved the IA to a spreadsheet and mapped out the full structure of the site, the spreadsheet allowed us to manage lots of other details about individual pages and made collaboration easier.
Sketches & writing
During the initial stages, I did lots of sketching and writing to help the team think through what we were saying and how it might take shape.
Prototypes & wireframes
To help us validate the IA I created a set of wireframe prototypes, using UXpin, mapping out various flows and ensuring that the full narrative of the site was cohesive. We tested internally and iterated accordingly.
Whilst working on new ways to describe our product and increase trial sign-ups, I created a series of wireframes to help everyone in Engine Yard think about how we could describe our product differently; focusing on the user, the benefits to them and less on the basic tenants of the platform. I also did the copy-writing and research on these. We are currently iterating on these and will be rolling them out as tests on our website very shortly.
Personas
We developed a series of personas for our different users and expanded on them during and after the design process for use in a wider business context.
Content Narrative
I created a narrative flow to help the team think about the reading experience as a whole and how the user might seek to understand us.
Other Research
User Testing: I did remote testing on the old site, competitor sites and the new site. I created recommendation documents and made design changes.
Heuristic Evaluation & Competitor reviews: I did a thorough heuristic evaluation of the old site, competitors and marketing sites in general, and created strategy documents from my findings.
Interviews: I created an interview questionnaire for staff and customers, conducted interviews, and fed the findings into our strategy documentation.
Analytics Review: I reviewed the old site’s analytics and integrated my findings into our strategy. I also created a stand-alone review document. Once the new site launched I ensured various sections were performing as expected and made changes where necessary.
Design Principles: I created the project’s design principles - 1. Lead the user, tell them what's important. 2. Focus on one thing. 3. Always ask people. 4. Have a reason for your decisions. 5. Make it flexible. 6. Test everything.
The Designs
Illustrations
It won a Web Award
Summary of my input in these projects
- Information Architecture
- Wireframes
- Personas
- Research
- Content Strategy
- User Testing
- Strategy
- Analytics reviews
- Illustration
- Design
- Front-end development
- Back-end development
