top of page
Case Study
Create Visualizing Data -OpenDataPhilly
Choose a group of data from the OpenDataPhilly site and visualized data for users.
Design Process
Data Review
Persona
Feature Map
Wireframe
Visual Design
Data Review
1.Primary Data
Name:
Condom Distribution Sites
Department:
Public Health
2.Data Information
- List the Places where can pick up Condom, such as health center, hospitals, stores, clinics, etc.
- Show spcific address information, open time and zip code. convenient for people to search one.
Persona
According to condom distribution site information, I created a persona after I talked with my target audience who would like to view this website and asked their thoughts on this site.
Feature Map
After collecting user's thoughts and needs, I came up with a five feature map which included necessary information and then show my target audience, let them pick one feature map which they think will demand their needs and will continue to develop wireframes.
Feature Map 1
Feature Map 2
Feature Map 3
Feature Map 4
Feature Map 5
Wireframes
After explaining to my target audience what basic information and actions in these five feature maps. Finally, I was going to pick Feature Map 1 to create two different types of wireframes, and then pick one to develop two different UI design.
Wireframe 1
Home Page
Choose Open Hours
Choose Specific Address
Wireframe 2
Home Page
Choose the location, open hours , zip code and address.
Choose the location, open hours , zip code and address.
Choose Location
Choose Zip Code
Show the result in map
Open the Filter
Show the result
Show the result
UI Design
I continue to develop the UI design based on wireframe 1.
UI Design 1
Home Page
Choose the Zip code and Address.
Choose Location and Open hours
Show the result.
UI Design 2
Choose one from different parts of Philadelphia.
Choose Open hours, Zip Code and Address.
Show the result.
bottom of page