Illustration by Jens Meyer

Kai the Coach

borahm
Borahm Cho
Published in
7 min readMay 28, 2015

--

A personal trainer service system for multi-screen use. (2011)

This is a short version of the bachelor thesis “Interaktive Magazinkonzepte” I wrote in 2011 at the University of Applied Sciences in Constance, Germany.

When the iPad came out in April 2010, I was impressed by the high-quality screen that made watching movies and viewing photos an incredible experience. Beyond screen quality, the iPad was as mobile as any laptop, had the size of a typical magazine, and the known interaction paradigms of the iPhone. It was the ideal platform to combine print media with the interactive world.

When you read on the iPad, your posture and environment are the same as when you read print media like books or a magazines. However, the new form of expression and the added interactivity create new contexts for reading. Now, you can take your entire magazine collection anywhere.

In the morning at the breakfast table, you can read digital content with coffee and toast — a situation rarely found with a laptop. With the iPad, the distance between screen and eye is significantly shorter, giving videos and images a completely different dimension.

Goal

The aim of this bachelor thesis is to develop a new interactive magazine format for the iPad that makes use of the device’s unique features and user experience. This format will be based on real interactions between the user and the app, and not simply a PDF with pictures and videos. The concept represents a new distribution model for recycling existing content, and is based on content from Men’s Health magazine.

Existing content will be packaged in a new, interactive format that will help the publisher generate revenue. Men’s Health content varies only slightly from year to year, and often focuses on similar themes like “six-pack in six weeks” and “lose your paunch.”

User

Robert the “athletic student”

Requirements: Tracking with the iPhone/iPad, training analysis, workout tips and suggested improvements, connection to social networks and fitness data from friends.

Frank the “shrink my belly guy”

Requirements: Fitness information, motivational content, workout reminders, fitness plan should automatically adjust to progress, automated tracking.

Scenarios

Value Proposition

Organize
Kai, your “personal trainer,” creates workout and nutrition plans, consisting of “article sets” on “Food,” “Health,” and “Fitness” that are adapted to the needs of the user.

Tracking
Kai simplifies the tracking of training and nutrition through the use of iPhone sensors (running and workouts), GPS (check-ins in gyms, local sports facilities), time (time adapted sports, nutrition and reminder system) and other techniques.

Motivate
Kai provides personalized reminders and notifications that motivate the user to work out, including intermediate training Goals (event cards) and the ability to challenge friends and compare results. A dashboard visualizes results so that they are accessible to the user.

Concept Maps, Wireframing, and Prototyping

After outlining the business and user goals, personas, and concept map, I sketched dashboards, notification systems, user flows and “global gestures” as part of the discovery process. After creating more high-fidelity wireframes, I started prototyping with HTML/JQUERY to test gestures, interactions, and flows. The prototype was limited, but good enough to get a sense of user interactions.

Concept maps are agreat way to organize and represent information.

Concept

Kai the Coach has three main components that create an immersive content experience.

Packages (Goals)

The user can choose between different packages and destinations (e.g. “six-pack in six weeks”), which include dynamic training plans with a set of event cards about Food, Fitness and Health.

The colors in the app play a central role in navigation. The color red is prominent in the Men’s Health brand, and is used here for information and actions only. In this case, each package is wrapped with a red ribbon that activates the package. The user should select one of these Goals. In the future, users could use the “in app purchase” function to buy additional packages. (E.g. new packages could include “Get fit with Michael Ballack,” etc.)

Event cards (Motivation)

Each event card has a unique number and is categorized with one of the colors sky blue (Fitness), royal navy (Health) or grass green (Food)

Each package provides a set of goal-oriented event cards that motivate the user with small intermediate tasks on the way to the “main goal” (e.g. “six-pack in six weeks”). Intermediate tasks include items like “Run 30 minutes during your lunch break” or “Eat a low-calorie dish tonight” with an attached recipe. Each card is identified with a unique number. The fitness cards contain additional information on calorie consumption and workout duration, so the user can get a better feel for the relationship between caloric intake and exercise.

In the future, it is conceivable that the user could buy or redeem additional cards containing new or more comprehensive training methods. Cards thus become collector’s items to be shared or traded for new recipes, workout methods, or other experiences.

Coach (Dialogue and notifications)

Kai provides information, advice, feedback, and motivation while the user is exercising. He establishes an interface for the notification system and enables the user to access more information. The user interacts through the Coach to start workouts, answers questions, or activate other functions.

The user receives information about training formatted as dialogue, rather than raw statistics: If a user has trained for at least three hours this week, his performance is “very good”; less than two hours is “bad.” Using simple parameters creates feeling of personalization.

A red button or section of text alerts the user that more information is available (statistics, timing) or that an action can be taken to start or finish an exercise session.

Dashboard (results)

The dashboard allows the user to monitor training progress against Goals or intermediate tasks.

Visual Design

“Kai the Coach” is a concept study for a personal trainer service system. The Coach interface combines interactive magazine content with workout planning and community features. The heart of the concept is an iPad app that offers dynamic information, motivation, and planning features. At the gym, exercises can be tracked with the corresponding iPhone app. Thus, Kai the Coach offers relevant content and features for any use case.

Thoughts

Content is no longer king. Users won’t pay for information that is available for free online, but will pay for services that enhance content. In this case, the experience enables users to easily navigate between different types of personalized content while incorporating dynamic community features. Personalization creates value, especially in cases where the content is available from other sources or media.

I can easily read “the 10 best tips for a six-pack” in a magazine, but when I need those tips, I never have them with me. When I’m at the gym or the supermarket, the magazine I need is in the office or at home. Interactive features are about much more than making existing content interactive: users can now have the right content at the right time and not all content at all times. I always have my iPhone with me, but I don’t need to read the whole article, just the exercise tips I’ve been looking for.

Credits

Design, Creative Direction
Borahm Cho

Concepting
Borahm Cho

Illustration
Jens Meyer

Follow me on Twitter or shoot me an email (borahm@borahm.de).
I’m always looking for fun, new projects to work on. ☺

--

--

borahm
Borahm Cho

always working on something new, Cofounder @kitchensurfing, product + design, hails from Germany, lives in Brooklyn, hunts ramen in his spare time.