Gabe Grayum: User Experience Professional

Hi, I'm Gabe. I design user-centered software.

I'm passionate about creating software that people actually want to use. By blending users needs with business objectives, I create intuitive user interfaces and desirable products.
PortfolioResume
← Case Studies

UI Redesign

In This Study
Usability Review
Information Architecture
Task Analysis
Task Flow
Wireframes
Interface Design
Results

This was one of my earlier projects at Pheedo. My goal for the redesign was to improve usability and get users to the data they wanted to see. The back-end had just been re-architected for scalability which presented certain constraints. User goals were mostly well known since they were required to make the platform run.


Usability Review

I performed a usability review of the existing user interface to make sure we learned from the past mistakes that had been made. This was also used to help justify the redesign.

Usability Review back to top ↑

Information Architecture

I created an inventory of functionality and content, documenting the API hooks in use. This was used to ensure that existing functionality was not left out unintentionally, and to identify required API changes.

I reviewed all content for appropriateness and conducted card-sorting to group the data so that tasks could be based on logical groupings. The Inventory was also invaluable in ensuring that every user input had a label, a default value, validation rules and an error message.

Inventory of Functionality back to top ↑

Task Analysis

I defined common tasks and categorized them, mapping them to users and objects. I could then link a set of similar tasks with a conceptual model so that recurrent tasks - like deleting an object - would behave consistently throughout the application. This sketch shows top-level tasks coded by user segment and one of the user object model trees.

Task Analysis back to top ↑

Task Flow

We created task flowcharts for tasks and task sets, defining the steps and decisions involved in completing a given task.

Task Flow back to top ↑

Wireframes

I developed low-fidelity wireframes to define the structure. A lot of thought and discussion went into creating a scalable architecture that would accommodate the introduction of new features required by the short release cycles of the product. I then directed the evolution of the wireframes into design mock-ups and functional HTML.

Wireframe back to top ↑

Interface Design

Every aspect of the interface design was scrutinized from a user perspective. One such example is form design. I conducted research and testing for optimal placement and behavior of fields, labels, descriptions and error messages specific to our product. This prototype was one step in the process of defining error prevention and recovery during user input.

Form Design back to top ↑

Results

The new user interface was a giant leap forward for Pheedo, bringing a Web 2.0 experience to a unique product. Support requests immediately dropped off and we received a stream of positive feedback from clients and our account management team.

Screenshot back to top ↑