The user will be able to interact with the program using mouse and.docx
Final U.S Caps UX Design
1. 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.
2. User Stories
Jimmy
Features 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.
3. 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.
4. User App:
David
Map interface is simple
and easy to understand.
Simply click any state
and 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
5. Features and
Functionalities
Features/Functionality
1. 50 interactive states
2. zoom in feature for each state
3. glowing edges for each state touched
4. name of capitals with glowing animated star for each state
5. sound for zooming in feature
6. Background sound feature when viewing the whole map
7. Log in window
8. sounds for log in window
9. segway animation for touching state capitals that goes into a new window
10. sound for segway animation sounds for touching capitals
11. animation for each state flag
12. text that pops up when touching flag
13. flag shrinks and goes to upper left corner when touched
14. 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 touched
16. clicking anywhere on the window creates an animation of the bird flying way (text disappears)
17. touching bird creates sound feature
18. touching flower enlarges image illuminating in the center of the window as text appears
19. touching anywhere on the window creates animation of flower blooming as the wind takes it away (text disappears)
20. sound feature of flower blooming
21. home button menu on each window
22. small animation of all the capitals landscape background
23. animations of the oceans around the map
24. animation when touching the oceans
25. Testing feature for each state when all three images have been touched
Version 1
Version 1 features all the features and functionality
listed above, as well as the test feature for each state.
Version 2
Version 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/Functionality
For 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/Functionality
For 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.
6. 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
Textappear/Flowerblooms
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.
