interactive prototype
DESCRIPTION
Interactive Prototype. Presenter Sean Ren Group member Alicia Kellogg Chris Schlechty Danny Swisher . Overview. Problem and solution Summary of Tasks UI Changes 3 Scenarios Tools and architecture Limitations and tradeoffs. Problem and Solution. - PowerPoint PPT PresentationTRANSCRIPT
![Page 1: Interactive Prototype](https://reader036.vdocument.in/reader036/viewer/2022081507/56816262550346895dd2c0d6/html5/thumbnails/1.jpg)
Interactive PrototypePresenter Sean Ren
Group member Alicia Kellogg Chris Schlechty Danny Swisher
![Page 2: Interactive Prototype](https://reader036.vdocument.in/reader036/viewer/2022081507/56816262550346895dd2c0d6/html5/thumbnails/2.jpg)
OverviewProblem and solutionSummary of TasksUI Changes3 ScenariosTools and architectureLimitations and tradeoffs
![Page 3: Interactive Prototype](https://reader036.vdocument.in/reader036/viewer/2022081507/56816262550346895dd2c0d6/html5/thumbnails/3.jpg)
Problem and SolutionExisting social networking sites aren’t aware
of real world location and activitiesRadr is a social networking site built mainly
for iPhoneUse Radr to locate friends, show people
where you are, share favorite locations, and learn information about strangers in your proximity
![Page 4: Interactive Prototype](https://reader036.vdocument.in/reader036/viewer/2022081507/56816262550346895dd2c0d6/html5/thumbnails/4.jpg)
TasksLocating a friend on a map (easy)
To pick them upTo deliver somethingTo meet up with each other
Finding out information about the people around you (moderate)see if friends are nearby have anything in common
with youCustomizing visibilities(difficult)
Create new layer of visibilitiesEdit existing visibilities
![Page 5: Interactive Prototype](https://reader036.vdocument.in/reader036/viewer/2022081507/56816262550346895dd2c0d6/html5/thumbnails/5.jpg)
UI ChangesCustomers had difficult time identifying where to find visibility settings
Changed visibility setting to display the word “visibility” rather than the current visibility status
![Page 6: Interactive Prototype](https://reader036.vdocument.in/reader036/viewer/2022081507/56816262550346895dd2c0d6/html5/thumbnails/6.jpg)
UI Changes
Make the toolbar lager but haven’t
implement the tooltip yet
Added persistent tool-tips to clarify actions of each visibility
tool
![Page 7: Interactive Prototype](https://reader036.vdocument.in/reader036/viewer/2022081507/56816262550346895dd2c0d6/html5/thumbnails/7.jpg)
UI Changes
Where to set visibility?
Click “Done” ! Final Product
![Page 8: Interactive Prototype](https://reader036.vdocument.in/reader036/viewer/2022081507/56816262550346895dd2c0d6/html5/thumbnails/8.jpg)
Scenario 1Locating a friend
on a mapClick on Friends tab
to view a list of friends.
List friends alphabetically.
Click on the friend you want to find.
On the secondary navigation bar, click Map to see a map of your friend’s location.
![Page 9: Interactive Prototype](https://reader036.vdocument.in/reader036/viewer/2022081507/56816262550346895dd2c0d6/html5/thumbnails/9.jpg)
Scenario 1Locating a friend
on a mapClick on Friends tab
to view a list of friends.
List friends alphabetically.
Click on the friend you want to find.
On the secondary navigation bar, click Map to see a map of your friend’s location.
![Page 10: Interactive Prototype](https://reader036.vdocument.in/reader036/viewer/2022081507/56816262550346895dd2c0d6/html5/thumbnails/10.jpg)
Scenario 1Locating a friend
on a mapClick on Friends tab
to view a list of friends.
List friends alphabetically.
Click on the friend you want to find.
On the secondary navigation bar, click Map to see a map of your friend’s location.
![Page 11: Interactive Prototype](https://reader036.vdocument.in/reader036/viewer/2022081507/56816262550346895dd2c0d6/html5/thumbnails/11.jpg)
Scenario 1Locating a friend
on a mapClick on Friends tab
to view a list of friends.
List friends alphabetically.
Click on the friend you want to find.
On the secondary navigation bar, click Map to see a map of your friend’s location.
![Page 12: Interactive Prototype](https://reader036.vdocument.in/reader036/viewer/2022081507/56816262550346895dd2c0d6/html5/thumbnails/12.jpg)
Scenarios 1Locating a friend
on a mapClick on Friends tab
to view a list of friends.
List friends alphabetically.
Click on the friend you want to find.
On the secondary navigation bar, click Map to see a map of your friend’s location.
![Page 13: Interactive Prototype](https://reader036.vdocument.in/reader036/viewer/2022081507/56816262550346895dd2c0d6/html5/thumbnails/13.jpg)
Scenario 1Locating a friend
on a mapClick on Friends tab
to view a list of friends.
List friends alphabetically.
Click on the friend you want to find.
On the secondary navigation bar, click Map to see a map of your friend’s location.
![Page 14: Interactive Prototype](https://reader036.vdocument.in/reader036/viewer/2022081507/56816262550346895dd2c0d6/html5/thumbnails/14.jpg)
Scenario 2Finding
information about the people around you Click on Friends tab to
view a list of friends. All friends are listed by
proximity by default. If there are few friends in your vicinity, select Show Strangers to see people in your vicinity who are not on your friends list.
![Page 15: Interactive Prototype](https://reader036.vdocument.in/reader036/viewer/2022081507/56816262550346895dd2c0d6/html5/thumbnails/15.jpg)
Scenario 2Finding
information about the people around you Click on Friends tab to
view a list of friends. All friends are listed by
proximity by default. If there are few friends in your vicinity, select Show Strangers to see people in your vicinity who are not on your friends list.
![Page 16: Interactive Prototype](https://reader036.vdocument.in/reader036/viewer/2022081507/56816262550346895dd2c0d6/html5/thumbnails/16.jpg)
Scenario 2Finding
information about the people around you Click on Friends tab to
view a list of friends. All friends are listed by
proximity by default. If there are few friends in your vicinity, select Show Strangers to see people in your vicinity who are not on your friends list.
![Page 17: Interactive Prototype](https://reader036.vdocument.in/reader036/viewer/2022081507/56816262550346895dd2c0d6/html5/thumbnails/17.jpg)
Scenario 2Finding
information about the people around you Click on Friends tab to
view a list of friends. All friends are listed by
proximity by default. If there are few friends in your vicinity, select Show Strangers to see people in your vicinity who are not on your friends list.
![Page 18: Interactive Prototype](https://reader036.vdocument.in/reader036/viewer/2022081507/56816262550346895dd2c0d6/html5/thumbnails/18.jpg)
Scenario 3Customizing
visibilities Click on Visibility to
see your current visibility settings.
Click “Edit” button to edit a visibility.
Draw a new region. Click “Done” to save
the region
![Page 19: Interactive Prototype](https://reader036.vdocument.in/reader036/viewer/2022081507/56816262550346895dd2c0d6/html5/thumbnails/19.jpg)
Scenario 3Customizing
visibilities Click on Visibility to
see your current visibility settings.
Click “Edit” button to edit a visibility.
Draw a new region. Click “Done” to save
the region
![Page 20: Interactive Prototype](https://reader036.vdocument.in/reader036/viewer/2022081507/56816262550346895dd2c0d6/html5/thumbnails/20.jpg)
Scenario 3Customizing
visibilities Click on Visibility to
see your current visibility settings.
Click “Edit” button to edit a visibility.
Draw a new region. Click “Done” to save
the region
![Page 21: Interactive Prototype](https://reader036.vdocument.in/reader036/viewer/2022081507/56816262550346895dd2c0d6/html5/thumbnails/21.jpg)
Scenario 3Customizing
visibilities Click on Visibility to
see your current visibility settings.
Click “Edit” button to edit a visibility.
Draw a new region. Click “Done” to save
the region
![Page 22: Interactive Prototype](https://reader036.vdocument.in/reader036/viewer/2022081507/56816262550346895dd2c0d6/html5/thumbnails/22.jpg)
Tools and ArchitectureDreamweaver, Photoshop, Safari, iPod TouchHTML, CSS and JavaScript front-endMySQL and PHP code back-end (no
frameworks)Google Maps for interacting with mapsPHP GD Library to draw images on the map
(hardest part)
![Page 23: Interactive Prototype](https://reader036.vdocument.in/reader036/viewer/2022081507/56816262550346895dd2c0d6/html5/thumbnails/23.jpg)
Limitations and TradeoffsMaps are not Draggable (use arrows)Difficult to interact with geographical data
(hard code the distance of friends)Screens are smaller than we expectedDifficult to track errors with imbedded code
or code across multiple files
![Page 24: Interactive Prototype](https://reader036.vdocument.in/reader036/viewer/2022081507/56816262550346895dd2c0d6/html5/thumbnails/24.jpg)
SummaryMake user to easy to locate friends, find out
people around him, and edit visibility settingsUser are able to complete all of the tasks in
the prototypeUse Wizard of Oz method to simulate some
features (GPS, distance, etc.)
![Page 25: Interactive Prototype](https://reader036.vdocument.in/reader036/viewer/2022081507/56816262550346895dd2c0d6/html5/thumbnails/25.jpg)
Thank you