AFINA-te

A Healthy Lifestyle Information Website, Online Food Diary and Exercise Log

Directly Towards Children

Nuno Guimar

aes

, Vera Ferro-Lebres

and Jos

e Carlos Ribeiro

Faculty of Sports, University of Porto, Porto, Portugal

School of Health, Polytechnic Institute of Braganc¸a, Braganc¸a, Portugal

Keywords:

Children, Exercise, Nutrition, Online, Website.

Abstract:

Childhood obesity is according to the World Health Organization one of the most concerning problems today.

Educating children to a healthier lifestyle is a difﬁcult task due to the lack of interest or concern that they

demonstrate. The interest that children have in technology and the time they spent online in games or simply

surﬁng the web may be seen as an opportunity to instill knowledge about healthy eating and healthy lifestyle.

There are already several online health counseling websites but it seems to exist a lack of such platforms

directly towards to children. Aﬁna-te website is an online platform that aims to monitor and educate children

to a healthier lifestyle through the exposition of information, interactive applications and educational games.

It is also capable of provide feedback about what users eat and the exercise they practice. This paper describes

the development and resulting health counseling website.

1 INTRODUCTION

Childhood obesity is a global problem with great con-

cern for public health. The body mass index (BMI) is

used to deﬁne overweight and obesity amongst chil-

dren and teenagers. When the BMI is higher or equal

to 95

considering age and gender then it is deﬁned as

obesity. When is between 85

to 94

it is considered

overweight (Barlow et al., 2007). The World Health

Organization (WHO) pointed out that in 2012, 44 mil-

lion children were overweight (WHO, 2014). In Por-

tugal, recent studies from the Directorate-General of

Health (DGS) concluded that approximately 35% of 6

to 8 year old children were overweight (DGS, 2013).

Obesity can also lead to several health problems in

short and long term periods (Daniels, 2009). To pre-

vent such problems, children must be aware about

the consequences of poor eating habits and lack of

exercise practice. The growing interest of children

in new technologies and the learning they take from

it (Akhter, 2011) could be useful to instill healthy

lifestyle knowledge. The use of technologies as a

way to spread healthy lifestyle habits is not new. The

study by Jarvinen (J

arvinen, 2007) shows already sev-

eral websites with free or paid subscriptions that al-

low users to receive online counseling about eating

habits and physical exercise. More recently these In-

ternet services have been using mobile applications to

facilitate the insertion of nutrition and exercise data

of users (e.g. My Fitness Pal (MyFitnessPal, 2014)

and My Net Diary (MyNetDiary, 2014)). The use of

smartphones with these services allows an easier and

quicker way to submit information and retrieve feed-

back on the eating and exercise behaviors of users.

However, the target users for this type of websites

are adults since it is of their own interest and ini-

tiative to stay healthy. Adults are willing to make

the effort to ﬁll food diaries, report exercise habits

and other type of information as long as they have

the feedback about their nutrition and physical con-

dition. In order to get the same goal for children,

the current websites will not work adequately since

their display of information and user interface design

is not suitable for the age group (Taslim et al., 2009).

The way children report their nutrition habits must

be simple, intuitive and enjoyable in order to make

them repeat several times (by their own initiative) that

process. The way that information is displayed must

also be taken in concern since children tend to prefer

larger letter fonts and images, animations and audio

to substitute text information (Bruckman and Band-

low, 2003). There is already some work attempting to

promote this healthy lifestyle education and simplify

the process of entering food and sport practice infor-

393

Guimarães N., Ferro-Lebres V. and Ribeiro J..

AFINA-te - A Healthy Lifestyle Information Website, Online Food Diary and Exercise Log Directly Towards Children.

DOI: 10.5220/0005459403930398

In Proceedings of the 7th International Conference on Computer Supported Education (CSEDU-2015), pages 393-398

ISBN: 978-989-758-107-6

 2015 SCITEPRESS (Science and Technology Publications, Lda.)

mation. Regarding healthy lifestyle habits there are

several works trying to spread knowledge in this area

through educational games. Grocery Hunter is an ed-

ucational mobile game that intends to teach healthy

eating habits to children and ﬁght obesity by mak-

ing them do healthy food choices when they are at

the grocery store (Kim et al., 2011). The application

consists in a search game where the users receive tips

from a cartoon regarding a speciﬁc food item. When

the player ﬁnds it, he points out the mobile camera to

it and the application will provide feedback whether

it is the correct choice or the wrong one. Another

work with the same purpose is the MunchCrunch.

This quiz team game with healthy eating questions

targets the teenagers and intends, in a fun way, to

teach them more about good nutrition habits (Man-

sour et al., 2009) . It becomes clear the contribution

that educational games have in children and how can

enhance their learning (Alemi, 2010; Virvou et al.,

2005). It is also important for children applying that

knowledge to their eating and exercise habits and see

how they are damaging or beneﬁting their health. So

it is important to have an online food and exercise log

so they can monitor both of those health components.

The GetFit website was developed with the purpose

of monitoring activity and eating habits for patients

of the Children Fitness Clinic (CFC) at the Univer-

sity of Virginia. The counselors can monitor patient’s

activity and nutrition habits between face-to-face ses-

sions through online diaries that the patients ﬁll. The

website also contains information, links and educa-

tional games regarding healthy habits (Olson et al.,

2010). Due to its development purpose, Get Fit web-

site was not design to provide feedback to their users

on their daily habits. It is comprehensive since it in-

tends to be used between patient-counselor meetings

and it is here where the patient receives the neces-

sary feedback about their habits. Another problem is

that patients must ﬁll their diary and activity logs. We

must question if they would still go to the website and

ﬁll the logs based only in their interests and motiva-

tion. The goal of this paper is to describe the basis and

the process of building the Aﬁna-te platform. Aﬁna-te

is the portuguese acronym for ”physical activity and

nutrition information for adolescents”. The website

is a health counseling Internet service speciﬁcally di-

rected to adolescents and its main goals are to pro-

mote a healthy lifestyle and provide counseling and

feedback depending on each user physical character-

istics (like weight, gender and height), eating journals

and physical activities. It is also the goal of Aﬁna-

te to make an intuitive and suitable interface, keeping

children interested in providing their daily nutrition

and activity habits.

2 RESEARCH APPROACH

The main goal of Aﬁna-te website was to provide

a speciﬁc and feasible alternative for kids of the

current nutrition and ﬁtness online platforms. The

project group consists in nutritionists, dietitians, ex-

ercise specialists and a web programmer. The project

started with the development of the Aﬁna-te database.

MySQL system was used to create and manage users

information like credentials, personal information

(i.e. address, cellphone, email), physical measure-

ments (i.e. weight, height), school and activities

schedule, food logs and exposition time. This last

one was one of the requirements since the beginning

of the project so we could try to understand where

users spend more and less time (consequently improv-

ing the pages they rarely visited). Exposition time is

controlled in the following way: every time a user ac-

cesses a page in the Aﬁna-te website, a timer starts

to run in the server. When he leaves the page, the

time he spent there, the user id and the name of the

page is stored in the database. The database was de-

signed to include information relatively to food items

and quantities. Aﬁna-te food database includes over

800 items and 2000 quantitative measures regarding

those items. Most of the items are retrieved from the

Portuguese Food Composition Table (FCT, 2014) for

precision purposes. However there is a small percent-

age that was retrieved directly from food labels. The

design phase began with the construction of a basic

website structure and suffered major changes along

the entire project, not only due to the feedback we

were taking from test users, but also from the study of

web design trends. The information presented in the

several sections has also change during the develop-

ment process since writing adaptations and text to im-

ages replacements were frequently made to create an

interesting website for the users age range. Nutrition

and exercise specialists wrote all texts from the site in

Portuguese. The type of writing was also adapted to

the age group in question. It was also deﬁned at the

beginning of the project the importance of establish-

ing a limit time of 60 minutes per day, so the website

itself does not encourage users to exceed the recom-

mendations of screen time (Kaneshiro et al., 2014).

3 RESULTS

3.1 Site Design

The site design consists in a navigation menu that is

always ﬁxed at the top of the page as ﬁgure 1 shows.

This menu has several buttons represented by icons.

CSEDU2015-7thInternationalConferenceonComputerSupportedEducation

394

The icons illustrate the section of the website the but-

ton leads to. However, since the icon may not provide

enough information on the section topic, a description

will come up on hovering the button (in the ﬁgure the

descriptions is “Take a Change”). There are two more

elements on the right side of the menu. The ﬁrst one

is a counter of how many users are online at the same

time (in this case 1) and the other is the remaining

time the user has for the day. Below the navigation

Figure 1: Navigation Menu.

menu we have the page content that varies according

to the section where the user is. Across all Aﬁna-te

website we use a ﬂat design. This particular kind of

design was made popular lately due to its use in oper-

ating systems (such as Windows 8 and OSX) and sev-

eral smartphone applications. The main features of

ﬂat design is the absence of shadows, gradients and

textures that are used for giving a three dimensional

effect (TheNextWeb, 2014).

3.2 Site Features

Figure 2: Example of content page.

The website is divided in 3 main sections: My Per-

sonal Space, Nutrition and Exercise. Nutrition section

has content pages about energy, nutrients, food wheel,

food and ﬁtness, healthy body and healthy recipes

(ﬁgure 2 shows an example). All this pages were de-

signed to display the information using the maximum

of interactivity, images and animations possible. As

an example, in each nutrient page we have speciﬁed

the necessary daily intake for each user based on the

data stored. We also have images to illustrate where

the nutrients are found, animated food wheels and in-

teractive recipe books. Below we describe the most

interactive pages in the nutrition section.

• Example Label - an interactive label where the

user can click in the different sections and learn

about them through information displayed in pop-

up windows;

• Label Inspector - in this section the user is asked

about concrete information on the nutritional val-

ues and ingredients presented on the label. He

must click in the label section where the answer

is. As an example the user could be asked which

ingredient is present in the largest amount. The

user must know (from the information provided in

the example label) that the ingredients are ordered

by the amount included in the product;

• ”Who Wants to Be Healthy?” - is a similar game

to the popular TV quiz show “Who wants to be

a millionaire”. The user must answer correctly to

15 questions of multiple choices using the knowl-

edge he acquired from other sections of the site.

The user has 3 help options: 50-50, call to a friend

and public help. The ﬁrst one random removes 2

wrong options of the total 4. The other two are

probabilistic choices. The more closer the user is

to the victory the less probable is to get the correct

answer from the “help”.

The exercise section contains information about the

different exercise components such as strength, ﬂexi-

bility and aerobic endurance. It also includes a section

with information about sports such as football, bas-

ketball and tennis. It is our goal to update this section

with new sports when Aﬁna-te is fully operational (in

order to keep users interested in the site). In the ex-

ercise section the user can also ask questions about

this topic. These questions are available to all users

so it should not be personal questions (there is a sec-

tion for those kinds of questions that we will discuss

later). Exercise specialists who collaborate in the site

will give the answers to the questions asked. The third

section of Aﬁna-te website is the “My personal space”

section. It is in this section that the user provides all

the information about his daily meals and weekly ac-

tivities. It is also in this section that the user retrieves

the most part of the feedback. We will describe the

different pages of this section in more detail.

3.2.1 My Personal File

In this page the user can check his personal data that

was given in the register (like address, birth date and

cellphone). It can also see his physical data such as

weight, height and fat percentage. This information

is displayed in text form. The rest of the page con-

sists in the following graphs: user fat percentage in

comparison with the recommended values, daily in-

take in comparison with recommended intake, daily

energy expended in comparison with energy intake,

monthly energy expended in comparison with energy

AFINA-te-AHealthyLifestyleInformationWebsite,OnlineFoodDiaryandExerciseLogDirectlyTowardsChildren

395

intake, daily nutritional (fat, protein, ﬁber and lipids)

consumption in comparison with daily recommenda-

tions. The previous daily and monthly nutritional in-

formation graphs can be consulted through navigation

buttons that allow selecting a speciﬁc date. The daily

information is only provided if such entries exist in

the food log.

3.2.2 Online Food Diary

To add a meal to the food log, the user must ﬁrst ﬁll in-

formation relatively to date, hour, type (i.e. breakfast,

lunch,. . . ), local and company. After the submission,

a new meal will be added to the meal list. The user

can them add food to that meal, delete the meal, see

the list of food items already added and see the nutri-

tional graph of the meal. The “add food item option”

has 2 different types of search: search by name (where

options are shown as the user starts to type the name

of the food) and search by food group. There is also

an option to copy a previous meal (since some meals,

like breakfast, are very similar) and a most frequently

used food item selection (where the most 5 used items

are shown for selection). In all options the user must

select the cooking method of the food (grilled, roast,

cooked...), a measure (1 spoon, 1/2 plate...) and quan-

tity ingested. The user can add meals up to 3 days

before the current day. He can also generate a daily

report in PDF with the correspondent nutrition infor-

mation for printing purposes.

3.2.3 My Weekly Schedule

In this section the user can deﬁne his weekly sched-

ule. This includes classes and extra curricular activi-

ties. The user can add or remove activities. Each time

a user adds a non-sport activity he must ﬁll a form

with the name of the activity, start and end hour and

day of the week. He may also add a description. In

case user selects a sport activity, Aﬁna-te website has

a database with more than 200 sports and respective

METS. METS is the unit of energy cost and it allows

the calculation of energy expenditure for a particular

activity (Mackenzie, 2003). This way, the graphs pre-

sented in “My Personal File” section are more precise

since they retrieve data from the user daily activities

to calculate the daily energy recommendation.

3.2.4 My Goals

Each user can deﬁne up to 3 different goals to improve

his health. The goals can be ”loose weight”, ”increase

muscular mass” and ”increase cardiorespiratory en-

durance”. The user must also establish a limit num-

ber of days to fulﬁll each goal. When it is submitted,

the nutritionists and exercise specialists who collabo-

rate in the Aﬁna-te website must validate or reject the

goal (if they think that is not achievable). They can

also leave advices to help the users fulﬁll them.

3.2.5 My Photos

This page is the user gallery to upload his meals, exer-

cises and other nutritional and sports related photos.

This section is mainly to give the user some social

network features although in this ﬁrst stage, the pho-

tos can’t be shared with others. It also allows storing

photos of the interactive food log whose functionali-

ties we will mention below.

3.2.6 My Questions

This is where each user can ask the nutritionists and

exercise specialists working in Aﬁna-te about their

doubts and concerns. The questions and answers will

be private so other users can’t access them.

3.2.7 My Parents Questions

The parents will have a special access so they can

keep track of the information that their children are

exposed to. However, such information will be rela-

tively only to the contents of the pages and no per-

sonal information of their children will be shown.

Thus, we guarantee the conﬁdentiality of users and

that they are not constrained on the information they

share. This is the only section exclusively to the par-

ents and it is similar to ”My Questions”. This is where

they can ask about any aspect of the website or receive

help tips to improve their children health habits.

3.2.8 Interactive Food Diary (What Did I Eat)

Figure 3: Example of the interactive food log.

In this section we provide a fun and interactive

way to ﬁll the online food journal. The user can

search the food in the item box that contains an

CSEDU2015-7thInternationalConferenceonComputerSupportedEducation

396

auto complete functionality (it will make suggestions

based in the inputted letters). Once the item is found

the user must select the cooking method and the mea-

sure type. In the end, an image of the correspondent

item will show up. The user must drag the item and

place it in any part of the plate. The same item can

be added multiple times since what it is dragged to

the plate is a clone of the original. To delete an item

from the plate the user should drag it to the trash bin

icon. To add drinks the user must click in the glass

button to open a popup window. Then he must select

the type of drink and measure using the “+” and “–“

to ﬁll and empty the cup (the drink in the cup refers

to the quantity that the user ingested relative to the

measure he selected). In the end he clicks “OK” and

the drink is added to the meal. It is possible to submit

multiple drinks by repeating the process. The user can

also add soup to the meal by clicking in the respective

button. A similar popup window will appear where

he can select the type of soup and measure. Multiple

soups can be added to the meal. With this interactive

application, the user can construct a very similar plate

to the one he had. When the plate is complete the user

clicks the submit button and must complete the meal

information such as date and hour. The user can also

take a picture of the plate that it will be stored in the

his personal gallery.

3.2.9 What I Should Eat

This page is very similar to the “What Did I Eat” page,

however it allows users to freely construct a meal in

the same way than before and get feedback (through

text and graph) on the adjustment of that meal in their

daily intake. This means that the user can learn if his

daily meals are adjusted to his daily nutritional intake

or not.

4 DISCUSSION

Aﬁna-te website is a new approach to an old issue: the

ﬁght against obesity. There are already several online

websites to help users to improve their health. How-

ever very few are directly targeted to children and the

ones that are, have an old design and lack of feed-

back due to the context that they were built (Olson

et al., 2010). Aﬁna-te intends to explore the relation

of children with technology to instill some healthy

lifestyle knowledge, making them use part of their

daily screen time to learn and receive feedback about

their nutrition and exercise habits. We predict that the

way information is presented and the several interac-

tive pages of the website will raise interest enough so

users continue visiting it and ﬁlling the food and ex-

ercise logs. It is also important to update the platform

with new content on a regular basis to keep users mo-

tivated to revisit it. The website developed takes in

consideration the several design studies made. Nev-

ertheless, children were not involved in the design

process being only used for occasional feedback on

a particular section or page. This may present a lim-

itation to the correct and intuitive use of the website

since children should be involved since the beginning

of the design and content development. Also, since

the age of the users differs widely, the content and

design may not be ideal for every user. However,

a pilot study is scheduled in one portuguese school

in different age users so we can have some feedback

relatively to design and content. We intend to deter-

mine which parts are suitable for all users and which

parts are needed to adapt for different ages and gen-

der. Based on the feedback we will create different

designs for the website which will be displayed ac-

cording to the user’s age. We tried to make a more

general design for the pilot study and we will adapt it

accordingly to the feedback received. In America, the

use of smartphones in children has increased signiﬁ-

cantly (Rideout, 2013) so the development of a smart-

phone application to complement the website would

be useful to simplify the input of information (since it

would be done on the ﬂy) and consequently provide

almost instantaneous feedback about the logs submit-

ted. The absence of such application could be seen

as a limitation to achieve more precision in the logs

since children tend to easily forget some food if they

do not write it down immediately after the intake.

5 CONCLUSIONS

Web-based interventions seem to allow users to ac-

cess information at their own pace (time, place, cogni-

tive assimilation of information etc.) (Grifﬁths et al.,

2006); permitting a better exposure and a more in-

tensive cognitive processing (Brug et al., 2003). In

particular, for adolescents also other advantages have

been identiﬁed, the effect of novelty; the attractive-

ness of the internet to this age range; and the use

of online communication as one of the main forms

of communication for young people (Grifﬁths et al.,

2006). Moreover the use of technologies in inter-

ventions regarding health knowledge has been recom-

mended (USD, 2010), considering that personal feed-

back on health practices together with tailored infor-

mation about the best health choices, has considerable

potential to communicate a personal need to change

(USD, 2010). In this paper we present a health coun-

AFINA-te-AHealthyLifestyleInformationWebsite,OnlineFoodDiaryandExerciseLogDirectlyTowardsChildren

397

seling web platform that, unlike other similar web-

sites, the target population are children. Each user has

access to easy to read information about nutrition and

exercise presented in simple text, images, animations,

interactive applications and games. They also have

access to feedback about their health through the ﬁll-

ing of interactive online food logs, exercise schedules

and chatting with nutrition and exercise specialists.

Aﬁna-te is a learning platform for children conse-

quently leading them to better understand, apply and

monitor healthy behaviors, therefore preventing and

help treating obesity and overweight. In the future,

we intend to make an intervention in several public

schools to determine if the site fulﬁlls its purpose . It

would be also interesting, in a future step, the creation

of a smartphone application for the Aﬁna-te platform

making it a full health counseling bundle (website +

smartphone application) for children.

ACKNOWLEDGEMENTS

Project supported by: PTDC/DTP-DES/1328/2012

(FCOMP-01-0124-FEDER-028619); and Research

Center supported by: PEst-OE/SAU/UI0617/2011.

REFERENCES

(2010). National action plan to improve health literacy.

United States: U.S. Department of Health and Human

Services.

(2013). Portugal healthy eating in numbers (Portugal

alimentac¸

ao saud

avel em n

umeros) – 2013. Direc¸

ao-

Geral da Sa

ude. Accessed: 2014-10-07.

(2014). Food composition table (tabela da composic¸

ao de

alimentos). Accessed: 2014-10-1.

(2014). World health statistics 2014. World Health Organi-

zation. Accessed: 2014-10-07.

Akhter, P. (2011). An extensive review on children’s learn-

ing process through their use of digital technology at

home. In 5th International Conference on Software,

Knowledge Information, Industrial Management and

Applications.

Alemi, M. (2010). Educational games as a vehicle to

teaching vocabulary. Modern Journal of Applied Lin-

gusitics, 2(6):425–438.

Barlow, S. E., MD, MPH, and the Expert Committee

(2007). Expert committee recommendations regard-

ing the prevention, assessment, and treatment of child

and adolescent overweight and obesity: summary re-

port. Ofﬁcial Journal of the American Academy of

Pediatrics, 120:S164–S192.

Bruckman, A. and Bandlow, A. (2003). Human-computer

interaction for kids. In Jacko, J. A. and Sears, A.,

editors, The Human-computer Interaction Handbook,

chapter Human-computer Interaction for Kids, pages

428–440. L. Erlbaum Associates Inc., Hillsdale, NJ,

USA.

Brug, H., Oenema, A., and Campbell, M. (2003). Past,

present, and future of computer-tailored nutrition ed-

ucation. The American Journal of Clinical Nutrition.

Daniels, S. R. (2009). Complications of obesity in chil-

dren and adolescents. International Journal of Obe-

sity, 33:S60–S65.

Grifﬁths, F., Lindenmeyer, A., Powell, J., Lowe, P., and

Thorogood, M. (2006). Why are health care inter-

ventions delivered over the internet? a systematic re-

view of the published literature. J Med Internet Res,

8(2):e10.

arvinen, P. (2007). Hybrid media in personal management

of nutrition and exercise. Technical Report 656, VTT.

VTT Publications.

Kaneshiro, N. K., Zieve, D., and A.D.A.M. (2014). Screen

time and children.

Kim, H., Kogan, A., Dasgupta, C., Novitzky, M. M., and

Do, E. Y.-L. (2011). Grocery hunter: a fun mobile

game for children to combat obesity. In Gross, M. D.,

Nunes, N. J., Do, E. Y.-L., Brewster, S. A., and Oak-

ley, I., editors, Tangible and Embedded Interaction,

pages 317–320. ACM.

Mackenzie, B. (2003). Mets. Accessed: 2014-10-1.

Mansour, A., Barve, M., Bhat, S., and Yi-LuenDo, E.

(2009). Munchcrunch: a game to learn healthy-eating

heuristics. In Paolini, P. and Garzotto, F., editors, IDC,

pages 166–169. ACM.

MyFitnessPal (2014). My ﬁtness pal. Accessed: 2014-09-

23.

MyNetDiary (2014). My net diary. Accessed: 2014-09-23.

Olson, A., Bond, M., Aspinall, B., Williams, B., Stoecker,

E., Jianping, W., Hellems, M., and Guerlain, S.

(2010). Supporting food and exercise monitoring for

overweight and obese children. In Systems and In-

formation Engineering Design Symposium (SIEDS),

2010 IEEE, pages 233–238.

Rideout, V. (2013). Zero to eight - children’s media use in

america 2013.

Taslim, J., Adnan, W. A. W., and Bakar, N. A. A. (2009).

Investigating children preferences of a user interface

design. In 13th International Conference, HCI Inter-

national 2009.

TheNextWeb (2014). The history of ﬂat design: How efﬁ-

ciency and minimalism turned the digital world ﬂat.

Virvou, M., Katsionis, G., and Manos, K. (2005). Combin-

ing software games with education: Evaluation of its

educational effectiveness. Educational Technology &

Society, 8:54–65.

CSEDU2015-7thInternationalConferenceonComputerSupportedEducation

398