Portfolio for:Brian JurvelinUser Experience (UX) Designer, User Interface (UI) Designer, Interaction Designer, Information Architect, Usability Specialist
Contact Information
Please contact me regarding potential job opportunities in the user experience (UX) field.
Name: Brian Jurvelin
Address: 29563 Linda Street, Livonia, MI 48154
Phone: 810-210-9323
Email: [email protected]
LinkedIn: www.linkedin.com/in/brianjurvelin/
Portfolio: www.slideshare.net/BrianJurvelin/user-experience-portfolio-29264390
Portfolio Outline
1. Mobile Application Design(Party Armor)
Project overview
Personas & usage scenarios
Design sketches
Wireframes
Paper prototyping/usability testing
Project results
Section 1 shows the evolution of one UX project from start to finish. Section 2 includes artifacts from multiple projects to illustrate UX skills not shown in section 1.
2. Website Artifacts (Multiple Projects)
• User research
• Competitive analysis
• Website diagram
• Card sort
• Task analysis
• Website interface redesign
• Usability testing
• Expert review
• Accessibility inspection
1. Mobile Application Design (Party Armor)
Project Overview
• Project: Mobile application design
• Client: Party Armor - creator of a dietary supplement designed to prevent and relieve hangovers resulting from consuming too much alcohol
• My Role: Lead designer
• The Challenge: Design a mobile application that helps increase the credibility of the Party Armor brand
• Scope Limitations: Graphic design and programming were not included in the scope of the project
• Extracted user needs based on user research provided by the client
• Developed a primary persona and three typical usage scenarios (shown here)
• Based remaining design decisions on what “Pete” would want
Persona & Usage Scenarios
Design Sketches
• Began the design process by sketching design concepts
• Sketches included potential interaction flows and layouts
• Sketches were used as the basis for wireframes and a paper prototypes
• Sketched multiple interface and interaction flow design concepts
• Highlighted functionality that promoted the users’ well-being (ex. call a cab) to increase brand credibility
• Used sketches as the basis for wireframes and a paper prototype
Interface design concepts
Design concept for an interaction flow
• Produced wireframes to model the initial design of the application
• Created wireframes using Moqups, an HTML based wireframing tool
• Generated a paper prototype from wireframes for usability testing
Wireframes
• Conducted ‘discount’ usability testing with paper prototypes to get feedback on the initial design
• Tested users using ‘think aloud’ protocol and recorded qualitative results
• Documented potential design changes based on user feedback
Paper Prototyping/Usability Testing
• Made design changes, such as adding a sign in that did not require Facebook
• Iterated between the design and usability testing phases to produce a final design
• Client was happy with the final design and is in the process of hiring a graphic design and a developer
Project Results
Before After
Design change made based on usability testing
2. Website Artifacts
• Created a survey and administered it to users of a graduate program’s student association website
• Identified the users’ needs regarding website content and information architecture
• Used information gained from the survey to help with the website’s redesign
User Research
• Conducted a competitive analysis to aid in the design of a new website for a sporting goods company
• Identified content and functionality included on the websites of four competitors
• Recommended content and functionality for inclusion on the new website
Competitive Analysis
Functionality included on competitor websites
• Diagrammed a local theatre company’s website (using Visio)
• Modeled the organization and structure of the website through page relationships
• Made recommendations for improvements to the website’s organization and structure
Website Diagram
• Conducted an exploratory card sort of the content on a local museum’s website
• Tested six users to gain insight into how content was grouped and how labels were interpreted
• Recommended changes regarding labeling and content grouping
Card Sort
• Analyzed the processes for completing three tasks on a car dealership’s website
• Documented the steps required to complete each of the tasks
• Redesigned the tasks to improve efficiency, reduce errors and increase user satisfaction
Task Analysis
Excerpt from one of the tasks included in the task analysis
• Redesigned a local pottery shop’s website interface
• Applied interface design principles and best practices to identify the strengths and weaknesses of the interface
• Produced wireframes (using Illustrator) to model the design of the new and improved interface
Website Interface Redesign
Subpage after redesign
Subpage before redesign
• Conducted a usability test of a stock photo website to identify user experience issues
• Used ‘think aloud’ protocol to evaluate ten tasks with five different users
• Recommended solutions for each issue, emphasizing issues with higher severity
Usability Testing
Transcript from one of the usability testing sessions
c• Conducted an expert review to identify the usability issues on a website that sells knitting products
• Created a list of usability issues, organized by the guideline that was violated and the severity of the issue
• Made recommendations on how to correct each issue
Expert ReviewDescription of a usability issue found on the website
Screenshot of the website showing evidence of the problem
• Conducted an accessibility inspection of a weather forecasting website
• Identified issues that could make the website content hard to use or inaccessible for users with disabilities
• Made recommendations on how to make the website more accessible
Accessibility Inspection
Screenshot of the website showing evidence of the problem
Description of an accessibility issue found on the website
