Also Available Portfolio Home | Specifications & Interaction Model Diagrams
I've documented a subset of project work, with which I've been involved, that best represents my approach to design. The goal is to explain "how we got there"—the design process, the tools used, the roles involved, and the artifacts produced to guide the design effort.
The purpose of this product was to enable HOAs to produce RFPs for services needed (e.g., snow removal, landscaping, pest control) and to enable vendors to bid upon these RFPs. The first phase of the product's development, documented here, involved a registration process for the vendor users and a set of tools for account management.
The user stories were written in advance of my involvement, so I initially reviewed the stories to get a high-level view of the product being built. Story questions and some rough ideas for the information architecture also came out of this activity. There was little documentation regarding the product's users (outside of the role names in the stories), so I worked with the PO to put some definition around the roles.
The next task was to design the navigation model for the vendor registration process. I represented it as a diagram to keep conversation from going too far down into design details that would be worked out during design sprints. The PO as well as engineers participated in this activity.
The team worked in two week sprints, and I ran the design a sprint ahead of the engineers to ensure the design was fully explored and defined by the time it was needed. I conducted the following activities during each sprint:
Some challenges on this project: it took a few sprints to come up with the right approach to the UI documentation. I needed to strike a balance between keeping it light and containing sufficient detail. Two week sprints presented a time challenge since I was responsible for producing the front-end assets. Lack of time also meant that we had to table usability testing to a future phase of the project.
This project entailed design and development of a new corporate intranet for Noodles & Company. Their existing intranet had issues with findability of information, navigation, and was generally not suited to the various user roles.
Initial design activities included meetings with project stakeholders to discuss and define user roles, the information taxonomy, and the mapping of roles to information. From these activities came conceptual and navigation models for the intranet site. These models illustrated the need to design for flexibility in how users find information. Some users navigated based upon their role, others based upon their department or the kind of information they wanted to find. Navigation style was also based upon user familiarity with the site's taxonomy: more experienced users were more likely to navigate directly to specific content areas instead of through roles or departments.
Wireframes were defined simultaneously with the information architecture to define the screen types, their layout, and the information available per screen. Two design iterations were completed and included reviews with project stakeholders and engineers to ensure the design was moving in an appropriate direction and that it was feasible from a technical perspective. Following wireframe development detail design was developed utilizing the wireframes and the Noodles & Company corporate style guide. After the detail design was reviewed and approved by stakeholders, I released design documentation and a style guide to engineers to address color usage, typography, and iconography.