Mobile Training Coach Video Site Design

August 05, 2011

v1.2

MTC Mobile Website for Smart Phones & TabletsDesign Concept Presentation

Splash Page

Home PageThe website is displayed in it’s simplest form as a mobile app to make best use of the small screen real estate. Contains the “What’s New” video list.

A button lives in the top bar that will act like a switch between “What’s New” and “All of MTC” content.

Video PageDisplays a large thumbnail image which can be pressed to play the video, a short title and description, the associated group number or title and a download button.

(Download button needs to be test on multiple devices to determine how the file is handled after download.)

All of MTC PagePressing the “All of MTC” tab displays two options to filter the videos list database.

By Topic PagePresents the list of available topics. Pressing a topic will directly open that video’s page. We recommend reorganizing the Topic list even further to decrease the number of videos shown. This

can be accomplished by creating another level of organization. (Example - Instead of listing all “Media Interface Plus” videos in the main list we would create a “Media Interface Plus” topic which will contain all videos associate with that topic.) This is one more level to click through but will definitely increase the user experience.

By Group PagePresents the list of available groups to filter the video list results. Pressing a group will display a list of videos within that group.

Our recommendation here is to add names to the group number for those individuals who my not know or remember all the codes associated with the videos.

Group Video List PageLists available videos of the selected group.

iPAD DESIGN CONCEPT

iPad Home PageThe iPad version of the website will be very similar to the desktop website except simplified. We slim it down to the basic needs, ”What’s New” and “All of MTC .”

The user is directed to the “What’s New” page as the home page where they can browse the latest videos quickly.

iPad All of MTC PageWhen the user presses the “All of MTC” in the top navigation they are brought to a page similar to “What’s New” but is organized into two different search methods, “By Topic” and “By Group.”

iPad All of MTC Page - By TopicPressing the “By Topic” bar activates an accordion style menu system revealing all the topic available.

iPad All of MTC Page - By TopicSelecting a topic opens the next level to reveal the videos associated with that topic. When the user selects a video

the right side is then populated with the video’s information. “By Group” works similarly.