UX Research and Design Portfolio
Post on 26-Jun-2015
Embed Size (px)
DESCRIPTION(Samples and Documentation)
- 1. JosephHowerton UserExperienceResearchandDesign UXPortfolioSamplesandDocumentation
2. Neighborhood Watch mobile application (prototype) 3. Project: Neighborhood Watch mobile application (prototype) Problem: Neighborhood Watch is a community awareness app that encourages citizens to "Check In" at trouble spots in their neighborhood. Goal: To reduce crimes or minor problems in an area, and generally, make neighbors aware of what's happening in their community. RolesandResponsibilities UserResearch(R is,CompetitiveAnalysis,Personaand ScenarioDevelop equirementsFindingsandAnalys UserExperience ment,UsabilityGoalsandUserTesting) (TaskFlowsandNeedsAnalysis) Documentation( tionDeck,UserTest,SupportingDocuments)SynthesisPresenta ProjectManager(ProjectPlanning) Requirements Findings Worksheet 3.1: Requirements Project Name: Neighborhood Watch mobile application (prototype) Project Date: Product Name: NeighborhoodWatch Current Phase: Design Prototype Name: Neighborhood Watch Requirement Name (Examples) Type Priority Validated? Y/N Results Requested Changes The system shall have a mobile and desktop aspect of the application. Functional / Interface High N The system shall, in the mobile and desktop portion of the application, require user verification. Functional / Interface High N 4. The system shall, in the mobile portion of the application, provide an interactive map to the user. Functional / Interface High N The system shall, in the mobile portion of the application, allow the user to tag an area for crime. Functional / Interface High N The system shall, in the mobile portion of the application, allow the user to check in on an area tagged with a crime. Functional / Interface High N The system shall, in the mobile portion of the application, use a mechanism to display the level and/or type of crime an area is noted for. Functional / Interface Medium N The system shall, in the mobile portion of the application, accept voice input for tagging. Interface Medium N The system shall, in the desktop portion of the application, allow the user to add more details to a tag he has previously made. Functional / Interface High N 5. The system shall, in the desktop portion of the application, allow the user to change settings and specify territories. Functional / Interface Medium N The system shall have a user rating system for preventing malicious use of the system, as well as encouraging a social and/or game-like feel to the application. Functional Medium N 6. Primary Scenario Frank Driving home from work, Frank passed by a grocery store, Erie St. Market, which had recently gone out of business. The building was vandalized with graffiti and the owner had moved out after being robbed a couple times. In a conversation with a neighbor, Frank expressed his disappointment; the grocer was a convenient place to shop on the street. Frank's neighbor, Kimberly, suggested he get more involved with the community, and he should install Neighborhood Watch on his smartphone. A number of people on the block were using it. Kimberly explained, "This app makes you aware of potential trouble spots in your community. After you register an account in your neighborhood, you can submit locations that need to be watched. Maybe a crime was committed on a block, like a car window was smashed, or a building was vandalized with graffiti. This context could be added to Neighborhood Watch. If you drive by this location on the way to work, the app will ask you to check out the location. When verify that everything is ok, you will get points attributed to your account, and this is called a Check In. You and your neighbors can compete for Check In points, and the person with the most points is awarded mayor of that location. You'll get ranked on the Neighborhood Watch website, which neighbors compete for top ranking and different badges for doing good work in looking out for their community. In addition to trouble spots, you can also tag areas that just need to be checked on occasion. For example, you can check the local park where kids play, or possibly check in on the senior citizen who lives alone, and confirm they're doing ok." Frank liked the idea of using the Neighborhood Watch app while commuting by car. The application connects to the in-car WIFI system and automatically enters driving mode, where it can respond to voice commands. When traveling past Erie St. Market, the car's audio system is lowered and the description is read, "check the south side of the building". Frank responds by voice command "OK", and a Check In occurs which give him three points. After a few months of using the Neighborhood Watch application, Frank has checked into a few trouble spots each week. Although he hasn't witnessed any crimes, he is more aware of what's happening in his neighborhood. He also checks the Neighborhood Watch website to see the rankings and badge awards. The results are that he knows his neighborhood and his neighbors better, and who really cares about the community by their track record of service to it. 7. Secondary Scenario - Cheryl Cheryl is a mother of two, a twelve year old and a four year old. Being a mother, the safety of the neighborhood they live is one her top priorities. Her subdivision is very close and operates a board of trustees that manage the subdivision's common areas. Cheryl is a member of the board. During their most recent meeting, Cheryl brought up an idea for the subdivision to implement. She wants the all their neighbors to start using this mobile application that she recently heard of. The app is called Neighborhood Watch, and the board agrees to use it. Cheryl drives her children to school every day. On the way to drop them off she passes the local 7-Eleven and Spiro's, the local Greek restaurant. She makes it a point to circle the buildings and mark down if there has been any vandalism. She uses the Check-In feature of Neighborhood Watch to mark down the location of the incidents. When she returns home she looks through the newspaper to mark down any incidents reported within the neighborhood. She inputs the addresses of the locations of the incidents in the paper. Later, Cheryl goes to the Neighborhood Watch website to get a full view of all the incidents and their locations. The website pulls in all the incidents reported and is the original location where the neighborhood trustee board has setup their neighborhood watch command center. Further, the website is where neighborhoods are added to the system to allow neighborhood members to join from their mobile devices. 8. Neighborhood Watch Mid-fi mobile prototype Neighborhood Watch Hi-fi mobile prototype 9. User Test Scenario 1: Mobile Check-in You have already established a user profile. After coming home from work, you are driving through your neighborhood and want to check-in to a flagged location that other members have concerns about. Scenario 2: Add Location You are walking around your neighborhood and you come across a garage door that has been vandalized with graffiti. You want to add a location to your neighborhood so that other members are aware of the trouble and can help prevent it from happening again. Scenario 3: Edit Profile You have used the NeighborhoodWatch application for a few weeks, and you would like to edit your profile. Findings & Recommendations Scenario 1: Mobile Check-in Findings Recommendations User assumes that prototype would store his username and password rather than having to enter it The final product will remember the user on the mobile device or web browser, but not necessary for the prototype User wonders whether if he has option to check-in to locations or how close he would have to be to the location to check-in Will have to determine approximate distance from location that will enable users to check-in for next prototype User would appreciate that his check-in activity appear in the activity feed This is an important contribution, and one that needs to be in the next prototype iteration 10. Scenario 2: Add Location Findings Recommendations User had trouble discerning the difference between flagging illegal activity/vandalism and flagging neighborhood activities. Didn't know that the app allowed for flagging both types of activity This needs to be more clearly explained. Need to determine if prototype should allow posting of both types of activity OR not. If we do, we need to make the difference more clear User wanted to be able to sort by his check-ins, other the check-ins of other users, or sort by location, sort by activity This is key functionality. The ability to sort flagged activity by type, location, and user is going to be integral to the next prototype User would appreciate that his Add Location activity appear in the activity feed This is an important contribution, and one that needs to be in the next prototype iteration Scenario 3: Edit Profile Findings Recommendations User wanted to see his social badges on his profile We should add this to the next prototype User wanted to be able to see other member's user profiles We should determine if we will turn this app into more of a social network where users can look at each other's profiles User wondered whether user profiles would be anonymous or not This is a key decision that must be determined in the next prototype 11. Park and Seek mobile application (prototype) 12. Project: Park and Seek mobile application (prototype) Problem:With the number of tasks people juggle at any given time, it is not so uncommon to get frustrated with certain occurrences such as spending a good amount of time looking for a parking lot, or worse, forgetting where the car is parked. Goal:ParkNSeek is an application that ensures motorists never have to look for a parking lot or their parked vehicles again. RolesandResponsibilities UserResearch(R is,CompetitiveAnalysis,Usability Goals,UseCasesa equirementsFindingsandAnalys nd UserExperience ScenarioDevelopment,UsabilityTesting) InteractionDes (TaskFlowsandNeedsAnalysis) ig ocumentation( n(ConceptualModelandPrototypeDevelopment) SynthesizedPresentationDeck) rojectManager(ProjectPlanning,UserTest,SupportingDocuments) D P User accesses the ParkNSeek mobile Application from their SmartPhone home page interface by clicking the ParkNSeek logo. 13. User is presented with the three primary functions/task options: FIND PARKING SAVE MY LOCATION FIND MY CAR User selects FIND PARKING. 14. ParkNSeek displays parking options results in a list format. User can also choose to view results in a Map View. Data displayed includes the users current location, an option to hear audio prompts and feedback, the capability to enter location manually, payment credit card options, whether there is GREEN/electric car parking available, the capability to sort by price or distance, and the capability to go back to the previous screen. User selects Randolph and State. 15. ParkNSeek displays the destination and turn by turn directions to that location. Other data displayed includes the option to view directions in Map View, the option to hear audio prompts, the capability to share the directions with friends, and the options to Change location, or Save Location, the ability to access the Help screen, and the ability to go Back to the previous Screen. User selects Save Location. User is presented with the three primary functions/task options: FIND PARKING SAVE MY LOCATION FIND MY CAR User selects SAVE MY LOCATION. 16. The locations is saved dialog box opens displaying the exact location of the Parked vehicle, including an icon of a car. User has options to hear audio feedback, add details to the saved location, share the details with friends, add another location, or clear the saved location, and the ability to access the Help screen. User selects Done. User is presented with the three primary functions/task options: FIND PARKING SAVE MY LOCATION FIND MY CAR User selects FIND MY CAR. 17. User is presented with the directions to the saved location of their car in the default Map View. Use of icons to represent the car at its location and the user at their current location. Other data includes the ability to access the Help screen, From location and To location specifics, the capability to view turn by turn directions, the option to hear voice prompts and Feedback, and the ability to go back to the previous screen. 18. Veruca Salt Fashion Boutique 19. Project: Veruca Salt Fashion Boutique Problem: Veruca Salt is struggling to find better ways to foster continuous communication with customers and do not currently experience a direct positive fiscal result from their various E- Commerce efforts. Goal: To create content and a community to keep users engaged and increase the rate of return visitors. Roles and Responsibilities User Research (Requirements Findings and Analysis, Survey Analysis, Persona and Scenario Development) Content Strategy: Taxonomy Strategy (The Three Cs of E-Commerce, by Mohanbir Sawhney) Documentation (Site Maps, Project Narrative, Supporting Documents) Co-Project Manager (Project Planning) The Three Cs of E-Commerce Community CommerceContent 20. S iteMapofVerucaSaltscurrenthomepage 21. SiteMapofVerucaSaltsproposedhomepage 22. Narrative So, its here that we will highlight our proposed site map for the Veruca Salt website. It is (foundationally) based off of our groups client interactions, the original site map we created of the existing Veruca Salt website, our competitive analysis, our sketches and wire-frames, as well as our ongoing project strategy, communications, and documentation. While we didnt throw the baby out with the bath water by any means, we have made some substantial, reachable recommendations for the Veruca Salt online initiative, and they are conveyed in this proposed site map. The first step we took was to create a site map of the current Veruca Salt website, to serve as a communication tool within our strategy team, as well as Veruca Salts project stakeholders, which would give us all a birds eye view of the existing Veruca Salt website, and to begin dialing into its strengths, weaknesses, opportunities, and threats. It was an assumption of our group (based off of Crystals initial face to face with Amber of Veruca Salt) that there were areas of the site that the client didnt have a total handle on; including their exact website inclusions and functions. So, though the Home Page was the real focus, we did document the various task flow offerings of the current site inclusions to provide as much insight as possible to the client, and our project team, as well as to give the client a backdrop to better understand our final recommendations. 23. So, as we began to create lo-fidelity sketches, we gathered around the core concept of creating more of an engaging, compelling, community experience for Veruca Salts online users. And the challenge...