final u.s caps ux design
TRANSCRIPT
U.S. CAPS
Concept: Map of the U.S. with states labeled and colored. Clicking on each state provides the capital as well as the state; flag, bird and flower. Each of the three items provides a brief summary of the history and origin of them.
User Stories
JimmyFeatures and Characteristics
Features and Characteristics
David
I’m studying for a geography test and I’m looking for an app that can help me
memorize all the U.S. capitals.I also enjoy history and would like to
learn more about each state.
I’m a parent that is searching for an app for my kids that is educational and simple for my kids to use. I want them to enjoy learning while having fun at the same
time.
• I am a 4th grade student preparing for a geography test• I am a visual learner and I’m looking for an app that can
provide fun and interactive learning material• I want an app that is quick and easy to use
• I am the father of a 4 and 6 year old, searching for a new learning app for kids
• I am a history teacher and would like my kids to learn more about U.S. history, while being actively engaged while they do so
• There are a lot of educational apps that I have been searching that would be too difficult for my kids to use, I want a learning app that will be easy for them to learn.
User App:Jimmy
Zooms into selected state revealing
the capital with a star next to it.
Click any state
Clicking state capital opens new window revealing the state; flag, bird and flower.
Flag Bird Flower
COLORADO
Flag
COLORADO
Clicking any of the 3 individual items
provides the history and origin of the
them.
User App: David
Map interface is simple and easy to understand.
Simply click any stateand it will reveal the star next to the state capital
Clicking the state capital prompts you to a new
window with the states; flag, bird and flower.
By simply clicking one of the 3 items, you will be briefed with a short history
and origin summary on the items.
Flag Bird Flower
COLORADO
Flag
COLORADO
Features and Functionalities
Features/Functionality1. 50 interactive states2. zoom in feature for each state3. glowing edges for each state touched4. name of capitals with glowing animated star for each state5. sound for zooming in feature6. Background sound feature when viewing the whole map7. Log in window8. sounds for log in window9. segway animation for touching state capitals that goes into a new window10. sound for segway animation sounds for touching capitals11. animation for each state flag12. text that pops up when touching flag13. flag shrinks and goes to upper left corner when touched14. touching anywhere on the screen creates short animation of flag flying away (text disappears)15. bird goes to left screen as text appears when being touched16. clicking anywhere on the window creates an animation of the bird flying way (text disappears)17. touching bird creates sound feature18. touching flower enlarges image illuminating in the center of the window as text appears19. touching anywhere on the window creates animation of flower blooming as the wind takes it away (text disappears)20. sound feature of flower blooming21. home button menu on each window 22. small animation of all the capitals landscape background23. animations of the oceans around the map 24. animation when touching the oceans25. Testing feature for each state when all three images have been touched
Version 1Version 1 features all the features and functionality listed above, as well as the test feature for each state.
Version 2Version 2 features all the features in version 1 as well
as giving the user to customize the color scheme of all individual states. There will also be new test questions
for each of the test features.
Simple Features/Functionality• glowing edges for each state touched• sounds for log in window• sound feature of flower blooming• sound for zooming in feature• sound for segway animation sounds for touching capitals• Background sound feature when viewing the whole map• text that pops up when touching flag• flag shrinks and goes to upper left corner when touched• bird goes to left screen as text appears when being touched• touching bird creates sound feature• bird goes to left screen as text appears when being touched• home button menu on each window
Advanced Features/Functionality• Log in window• 50 interactive states• segway animation for touching state capitals that goes into a new window• touching anywhere on the screen creates short animation of flag flying away
(text disappears)• clicking anywhere on the window creates an animation of the bird flying way
(text disappears)• touching flower enlarges image illuminating in the center of the window as
text appears• touching anywhere on the window creates animation of flower blooming as
the wind takes it away (text disappears)• small animation of all the capitals landscape background• animations of the oceans around the map• animation when touching the oceans• Testing feature for each state when all three images have been touched
Explanation for Simple Features/FunctionalityFor the simple features/functionality we will need the
graphics team to create a colorful and eye catching design for kids of the map of the U.S. with all 50 states labeled. The graphics team will also need to create a playful typography
for the text of the 3 items. The tech team will need to create basic touch functionalities for touching the states and capitals as well as the three images displaying the text. We will need a home button interaction for each individual state as well as the
capitals landscape window.
Explanation for Advanced Features/FunctionalityFor the advanced features/functionality we will need the graphics team to create an animation for the oceans surrounding the map. We need an exciting zoom in animation after the user after touching the glowing star
next to the state capitals. Each of the three images in the capital’s land-scape window will need separate animations for each. As well we need
an engaging city landscape for all the state capitals. The tech will create the functionality for the login/sign up
menu. Create touch function for the swiping finger across ocean. Quiz functions and grading features for each individual quiz.
User Pathways
User Window
Sign up/ Login Main Menu
Home Menu
Main Menu
Touch State
Touch Capital
Touch Flag
Touch Bird
Touch Flower
Touch anywhere
Touch anywhere
Touch anywhere
Touch anywhere
Touch home button
Touch quiz button
Touch finish quiz button
Text appear/Flag moves up
Text appear/Bird moves up
Text appear/ Flower blooms moves to center
Text disappears/Flag glides away
Text disappears/Bird flys away
Text disappears/Flower blows away
Quiz questions appear
Evaluates and grades user
Graded score disappears
Zoom out animation
Zoom in
Feature/Functionality
Zoom in animation Landscape of Capital
Landscape of Capital
Landscape of Capital
Landscape of Capital
Landscape of Capital
Landscape of Capital
Landscape of Capital
Landscape of Capital
Landscape of Capital
Landscape of Capital
Landscape of Capital
Individual State
Map of U.S.
Map of U.S.
Wireframes
Map
Map
FlagFlag
BirdBirdtext
text text
Bird
Bird
FlowerFlower
Flower
Flower
Flower
State
city landscape city landscape city landscape
city landscape city landscape
capital
ocean ocea
n
Sign up/Login
Mockups