Rapid Redesign Project Adding a pause button and volume adjustment for Instagram video post Zul Tinarbuko | Vico 5161 | 11/14/18 Contents Cover User persona Problem Analysis Original Sitemap Redesign Sitemap Competitive Analysis Userflow Design prototype
01 02 03 04 05 06 07 08
User Persona Gerald, 14 years old Content creator / Youth influencer
Kevin, 34 years old Video Consultant
Behavior
Behavior
- Digital native. - He creates a lot of content about his daily life. - His goal is to become a singer. - He covers many popular songs and uploads them to his social media accounts. - He has 15,000 followers and counting.
- Multimedia producer - He has works as a video consultan for many different brands - His current job is to create an ad content for an outdoor brands that will be posted on social media.
“I want to use instagram as an extention of my daily life” Goals - Be able to use instagram with ease - Gain more followers by creating more content Frustation - Cannot adjust the volume directly from the video post
“I’m looking for an effective video ad in Instagram” Goal - Create an effective video advertisement for Instagram. Frustations - Cannot easily navigate video post to see the details (i.e pause and rewind the video). - He needs to wait for the video to finish before he can see the details of the video.
Problem Analysis “You’ll always find more problems than you have the resources to fix, so it’s very important that
Icon indicates a video post and a video length indicator
Auto play video, can’t be paused, fastforwarded or rewound
you focus on fixing the most serious ones first.” - Steve Krug, Don’t Make Me Think Revisited
“Any user experience effort aims to improve efficiency. This basically comes in two key forms: helping people work faster and helping them make fewer mistakes.” - Jesse James Garrett, Elements of User Experience
Little icon/button to enable sound, but this is problematic when users click this icon or tap the video it will make the user like the video - Josh Constine, TechCrunch
Further menu
Video Timeline Site Map
SHARE FACEBOOK
SHARE WHATSAPP
Navigation post
SHARE TO...
Instagram feed LIKE
COPY LINK
PHOTO HOME
COMMENT TURN ON NOTIFICATIONS
TIMELINE VIDEO
- Au t o play - No pau s e b utton - Small aud io icon - Can ’t adjust the aud io - Can ’t fast-for ward or rew in d t he vid eo
SEND
REPORT
SAVE
MUTE
...
UNFOLLOW
CANCEL
Video Timeline Site Map (Revised)
Instagram feed
LIKE
PHOTO HOME
Additional navigation
Video post navigation
COMMENT
PLAY/ PAUSE BUTTON
TIMELINE VIDEO
SEND ADJUST VOLUME SAVE
“You don’t have to fix each problem perfectly or completely. You just have to do something—often just a tweak—that will take it out of the category of “serious problem.” Steve Krug, Don’t Make Me Think Revisited
...
- By a ddin g pla y a n d pa u se bu tton s, u se r s will be a ble to n a viga te th e vide o post e a sie r. - Th e y will be a ble to pa u se a n d sc re e n gr a b th e in f or m a tion f rom th e vide o. - Th e y will a lso be a ble to a dju st th e volu m e dire c tly f rom th e post.
Competitive Analysis Facebook
Youtube
1 2 3
4
“The navigation is over here. Some parts will change a little depending on where you are, but it will always be here, and it will always work the same way.” - Steve Krug, Don’t Make Me Think Revisited
1. Play and pause button clearly available 2. Timeline video cursor 3. Video length indicator 4. Audio volume adjustment
User flow Diagram After
Before
Icon indicates a video post
Video length indicator
Auto play video, can’t be paused, fastforwarded or rewound
Pause button (tap one for pause/ play, tap two for like)
Little icon/button to enable sound, but this is problematic when users click this icon or tap the video it will make the user like the video
Mute/unmute sound Video cursor
Technology is always changing, and the field of user experience always has to adapt to it. Nevertheless, the fundamental elements of user experience remain the same. - Jesse James Garrett, Elements of User Experience
Volume adjustment
Design prototype Before
After The more clearly we can articulate exactly what we want, and exactly what others want from us, the more precisely we can adjust our choices to meet these goals. - Jesse James Garrett, Elements of User Experience
Conclusion: 1. Users need more clear and easy navigation. 2. There is supposed to be an exact rule of how video features can be played in mobile app. 3. Play/pause button is still important no matter how long the video is. 4. When users can navigate the video with their thumb it will create easier access to the content.