Designing of mock up – step 6

I opened Adobe Photoshop CS6 and started to design. This is what I came up with –

1st version

As you can see on the picture above, I tried to stick to colour scheme that I’ve chosen but I don’t think it looked good. Title of the site is in white colour but middle word ‘healthy’ is in rainbow colours because I thought that it might give it a bit of ‘playful’ look; rainbow has 7 colours and this word consists of 7 letters so I thought it would be perfect. But when I looked at it later on, I didn’t like it!
After consultation I decided that it is not good design at all and I didn’t like it because it does not look professional at all.

Second attempt

After unsuccessful first attempt of design and consultation, I had a few very good ideas drawn on the paper.

2014-02-19 20.03.41

As you can see, there is a new layout of the site drawn and instead of words in navigation, I decided to have icons that symbolize words instead. The reason for that is that this task is more about the design than about anything else and people automatically link pictures to words, it is common sense and humankind did it thousands and thousands years ago when they painted pictures in caves.

I opened a new page in Adobe Photoshop CS6 and started all over again. This is what I came up with but this time, I sticked to exact colours that I’ve chosen –

2nd version

As you can see on the picture above,there is a massive improvement and professional look added into it comparing to my first design of the site. I sticked to font colours and the reason why it has two different colours is that I wanted to make word ‘healthy’ to stand out a little bit so your eyes automatically look there. They layout of the site stayed the same, I just toned down colours so it does not ‘shout/scream’ at you as much as the first design did. As you probably noticed, the left sidebar for navigation is empty as I am having a problem to find right icons on internet.

Research about colour scheme

In my previous posts (click here to read more), I was talking about colour scheme for my website. However, after quick visit of a shop one day, I saw a box of tea and colours were just beautifully matched. I took a photo of it on my phone so I could work with it later on. (Inspirations are everywhere around us!)

Untitled-1

Research about colours

I did a little research about theory of colours to see if I could actually use it as my topic is ‘children’s healthy eating’. I found that purple colour is ‘the color of good judgment’ and that most children love this colour. I also did a little research about personality of people who like purple colour and I found out that  those people are sensitive, supportive, thinking of others before themselves and other people like to come to them for help. (read more about it here) All of these information gave me a good evidence that this combination of colours for my website would be a good choice as I want to target parents instead of children (read more about the target audience in my post here) even thought it is unusual colour scheme for website about healthy eating. Colours that are usually used are green, brown, orange, gingery colour and soft blue.

Colour scheme/site map – beginning of step 5

Colour scheme

This is colour scheme that I decided to use for my website:

colour scheme

The reason why I chose this colour scheme is because after research about colour meanings, I found out that green is colour of well being, health and this is exactly what the site is going to be about.

Site map – navigation

For navigation, I was planning on having main navigation consisting of Home, 0-5, 6-15 categories
and sub-navigation for every category.

Site map for main navigation

site map

Drawing – main navigation + sub navigation

2014-01-14 23.04.32

However, sub-navigation would have to be scroll down navigation and because of tablets and mobile phones it is not good to use scroll down menu. So my plan would not work and I had to think of alternative plan.

I had a look at a few websites and I came up with a solution that I think it’ll work but it took me a long time thought.
I will use only main navigation as I planned in the beginning and then I will design something like this and use it as link to other pages – navigation

My version of it

2014-01-14 23.05.10 2014-01-14 23.18.47

Technical requirements – step 3

The website that I’m going to design is going to be a static, which means designed with HTML,CSS and Java.
I was considering if to make it adaptive/responsive because a lot of people use different devices for browsing internet these days. It would be very helpful to be able to just find a recipe on your mobile when you’re in a kitchen and in rush and need to prepare a good meal for your kid but then it came to mind that this task is more about actual design and user experience and adaptive/responsive design would destroy it; it would simply not work. I could design different designs for different devices but that would take me a lot of time and I do not have it because of other work I have to do for modules.

Analyzing websites about children’s healthy eating – Step 2

When step 1 (research) was all done, I needed to find out what types/designs of websites are already out there to find out what I need to include in my website and what to do better so my website is unique and not like rest of the website on internet. That’s why I had a look at design of different websites. Most interesting ones were only 3 sites and that’s why I decided to get ideas from them.

www.eatright.org 

1website

The design of this site was amazing, I liked it a lot. It was playful and colour scheme was just great. In navigation you can choose age categories so content suits to what you’re looking for; for example ‘in the kitchen’ – cooking methods, preparation, food safety
‘meals’ – breakfast, lunch, snack, dinner
This is what I’d like to use on my site – two different navigations and colour scheme and also green line across the full screen.

www.childrensfoodtrust.org.uk

2website

Design of this site was very interesting as it wasn’t too complicated (simplicity). I liked colours of navigation and footer of the site that’s why I’d like to do something similar on my site.

www.healthystart.nhs.uk

3

This site was very playful and nicely designed. The layout didn’t change it was only content of the site. This is what I’d like to create on my site.

Overall, looking at different websites game me an idea how my website might look.

  1. I want to make it more serious than playful as a target audience are parents of children (finding after doing a deep research)
  2. main navigation + sub navigation
  3. line across the full screen
  4. footer with navigation + social media icons
  5. colour scheme: white background and green or blue colour

Why is healthy eating important for children

While researching my target area, I came across to this website – www.pre-school.org.uk

There was a list of things why is healthy eating important for children and because I found it interesting I thought I’ll share it with you.
(!The list is downloaded from the website named above!)

Why is a healthy diet for young children so important?

  • It helps to improve their concentration, learning and behavior.
  • Promotes proper physical growth and development.
  • Builds up their strength.
  • Promotes resistance to infection.
  • Gives plenty of energy.
  • Minimises future health risks like iron-deficiency anaemia, obesity, Type 2 diabetes, heart disease, stroke, cancer and dental decay.
  • Helps them to establish healthy eating patterns and habits for life.

Target audience

From all information I got so far while doing my research, I came to conclusion that parents that are interested in their children’s healthy eating must be aware of advantages that comes with eating healthy and want to give their children the best they can. Also they are aware of risks that comes with eating unhealthy that is why they prefer to forestall future illnesses by teaching kids how to live and eat healthy.
Maybe they grew up in household with the same rules and they want to pass it on to their children, maybe they just decided to start to live and eat healthy and that is why they involve children in it as well.

What influence children’s eating – research

Research done by reading ‘Promoting healthy eating for children‘. (page 14-18) (downloaded from Google)

Different studies showed that children are great learners. Before they start to go to nurseries and schools, they learn from parents at home. That is why parents have a massive influence on children’s eating habits. When they go to nurseries and schools, they are more likely to like what they peers like.  Also mass media has the same effect on children. What is presented in media as ‘good’, they are more likely to want try it themselves (For example McDonald’s). That’s why it is very important to not only teach children at home to eat healthy but also advertise healthy eating in media.

It was very interesting to read about it.

Needs of the client/focus groups

Needs of the client

After having a look at so many websites about children’s healthy eating, I found out that the people need to know age category of their children as every site is divided into categories *0-5
                                                                                                 *6-15
*16-18

That’s why there are different needs of people that visit those websites.
I decided to focus on age groups until age of 15.

Deep research made by reading 44 pages of ‘Nutrition Guidelines for the Under Fives’ (PDF file downloaded from Google)

0-5:

  1. developing healthy patterns from an early age helps to promote positive attitudes to good nutrition
  2. Infant nutrition (up to one year) – Breast v. bottle milk, Weaning (from 4-6 months), Which milks are suitable to give infants as a main drink?, Food hygiene and safety issues for infants
  3. Nutrition for children aged 1 to 5 years – serving of food – fat, sugar, energy, iron
  4. Drinks for 1 to 5 year olds
  5. Which milks are suitable to give to children aged one to
    five years as a main drink
  6. Ethnic Food Choices
  7. Menu planning
  8. Ideas for nutritious snacks
  9. Dealing with food refusal
  10. Packed lunches – nurseries and playgroups
    without lunch facilities
  11. Tips for preparing packed lunches
  12. Packed lunch ideas
  13. Dessert ideas
  14. Food-related activities
  15. Physical activity

Useful information about children of age group 6-15 found on ‘Healthier diet of young children’. (PDF file downloaded from Google)

6-15:

  1. knowing what to include in daily meals – fat, protein, sugar, energy, iron etc.
  2. how to interest children in cooking (more likely to interest in trying a new meal that they help to prepare)
  3. what ingredients to use instead of unhealthy ingredients
  4. a child-size serving
  5. pyramid food groups
  6. snack time/healthy snack
  7. family activity (biking, family trips to nature, active play for children etc.)
  8. healthy weight
  9. how much sleep children need
  10. what to pack in school packed lunches – making sure they eat healthy while at school
  11. how to be a right role model for children

After my research about different children age categories, I realized that children’s healthy eating is not only about food, it is also about getting kids active, making plans for them interact them with cooking in kitchen and be right role model for them.

Beginning of my research – Step 1

First of all, I had to find out a definition of ‘children’.

Biologically a child (plural children) is a human between the stage of birth and puberty.
According to law, children are ‘human beings below the age of 18 years’.
(read on http://en.wikipedia.org/wiki/Child)

When I knew clear definition of children, I was able to start with my research. I typed into ‘Google’ children’s healthy eating’ and it came up with so many different websites. I went through most of them, some of them it was just quick look but the website I found very interesting was NHS.uk. It was very helpful not from designing point of view as I think it is a bit boring site from that point but I knew that all information there are trustworthy.