EL6072 - Interactive Courseware Workshop

Proposal and Storyboard Assignment

Title: Family Feasts: A resource of healthy recipes for busy families

Student: Sinead Wall

Student Id: 18178928
Lecturer: Elaine Walsh

0|Page
Contents
Part 1: Design Proposal ............................................................................................................................... 2

Introduction ......................................................................................................................................... 2
Target Audience .................................................................................................................................. 2
Writing Style ....................................................................................................................................... 2
Interface Design .................................................................................................................................. 3
Interactive Features ............................................................................................................................. 4
References ........................................................................................................................................... 7
Part 2: Storyboard ......................................................................................................................................... 8

1|Page
Part 1: Design Proposal
Introduction
Cooking for the family is a chore that faces every busy parent. Parents need to know how to cook
healthy simple recipes that will make their lives easier. I propose an easy to use resource that will
provide straightforward recipe ideas to encourage parents to cook more fresh food and get the whole
family involved in cooking together.

The resource will focus on recipes for the main meals of the day, healthy snack suggestions and
additional resources for parents to explore. There will a focus on ‘hints and tips’ to make cooking
easier or suggestions for alternatives. Parents can bookmark their favourite recipes and they can print
out a document with all the recipes from the website if they choose.

Target Audience
The target audience for this website is Irish parents, male and female. I believe there is very poor
resources aimed at the Irish market and currently there is no central resource on this topic. Most
parenting websites or cooking websites aimed at the family are very orientated towards females. This
may exclude males and I want my resource to cater for both male and female. I have incorporated this
into the design as Lee and Owens (2004) suggest by excluding any element that could offend
culturally sensitive audience members or be viewed as religious or sexist in nature. This is done
through an equal representation of male and females in visuals and unisex text.

There are plenty of American resources online, however, ingredients and measurements used in these
recipes can make them difficult to follow for Irish people. There is also a move away from written
recipes towards video, which can be useful to show techniques but are not very practical to stop and
start when you are in your kitchen cooking. Another current issue with recipe websites is having too
much narrative describing the background of the dish or the chef. I propose that my site will be easy
to navigate and will exclude any extraneous material.

Writing Style
Lannon and Gurak (2015) advise using a friendly but professional tone for your website and ensure it
is appropriate for the audience. My intended audience are Irish parents therefore I need to write in a
language that connects with the readers knowledge, experience, beliefs and values (Shriver 1997). It is
important that this connection is made through words, pictures, layout and general ‘look and feel’ of
the resource.

2|Page
Lannon and Gurak (2015) also recommend using short simple sentences in the active voice. This is
very relevant for my website as I strongly believe recipes should be written in a simple coherent way
with very clear instructions for each step. The information will also be chunked into short passages
and numbered steps to make directions easy to access and follow.

Positive constructions will be used following advice from Markel and Selber (2018). Language will
be constructive, helpful and upbeat to encourage readers to use the site and try out the recipes. Hints
and Tips will be presented on each page to give alternatives or suggestions to readers.

“Add interest and relate to the audience”, suggest Lee and Owens (2004). This will be achieved by
writing in plain English, using short words and addressing the reader directly. Abbreviations and
technical terms will be avoided as these can alienate readers.

While the resource is aimed at parents, it is available for families to use together, therefore the text
should be understood by children also. The Neilson Norman Group (2015) recommend that an eighth-
grade reading level should be used if you are targeting a broad consumer audience. I will check
readability of the text using Flesch Kincaid reading level to ensure the reading level is kept within this
guideline.

Interface Design
Lannon and Gurak (2015) recommend the designer should picture the documents overall look and feel
when they are making design choices. The overall design for this website is a simple easy to use
resource that is appealing to parents. There are no flashing images or animations, I wanted to create a
calm space. The mood of the website is created by the written style and the composed structure and
layout.

The background colour is white to ensure the pages are uncluttered and easy to navigate. There is an
even balance of text, visuals and colour, which Lannon and Gurak (2015) deem important. Visuals are
used to balance the text and as a mechanism to relate with the users. People skim websites looking for
something to interact with and it’s important to have high quality appealing photographs of the dishes
on this website. Markel and Selber (2018) feel that a plain background is better as patterns can distract
the reader. I feel the plain background supports the high-quality photographs and simple text to
achieve a professional and appealing appearance.

Lee and Owens (2004) recommend no more than four colours on the screen. The colours I chose were
based on both the theme and the complementary colours recommended on www.color-hex.com. I
decided to choose green as the main colour as it symbolises health and nature. It’s a muted green to
appeal to the adult audience. The purple was chosen as a complementary colour and is used sparingly
throughout the website to ensure the simple tranquil design is not compromised. Markel and Selber

3|Page
(2018) state that colour combinations must be considered and it’s important to avoid strong or dark
colours on a dark background, which I have done by using dark text on a white or green background
and a white text on purple.

Hex codes of the colours chosen are:

• Black - #242224
• Grey - #5C565C
• Green - #8EB48B
• Purple - #B18BB4

Consistent screen areas for repeated screen elements such as titles, feedback, links, menus or prompts
should be considered in the layout according to Lee and Owens (2004). My website has a strong level
of consistency, due to the uniform header and footer on each page, the colours are consistently used
for the navigation buttons, headings and icons. Each recipe is on a separate page with a photograph of
the dish and a consistent layout for the detailed information.

The same typeface is used throughout the website, with different font sizes used to create order of
navigational tools, headings and body text. I choose Calibri as I feel sans-serif font is easier to read
online even though recent Neilson Norman group research states that advances in screen technology
makes all fonts useable online (2015). I feel this font is clear and comfortable to read. They also
recommend the default font should be at least 10pt, and 12pt if you have senior citizens using your
site. To ensure inclusivity I have used a minimum of 12pt font on my website. Font styles are
included in the storyboard.

Interactive Features
The website will be built in Adobe Dreamweaver, using HTML for structure and CSS for style and
layout. Visuals will be in PNG format as advised by W3C (2019).

Lee and Owens (2004) advise to include a consistent navigation design so users become comfortable
with the environment. As you will see from my storyboard, I plan to keep a consistent navigation
system which includes a simple menu across the top of the page and a back button on the lower right.
Most people in western cultures view screens using a Z pattern therefore the most important
information is placed across the top and the most often used navigation button is on the lower right.

Markel and Selber (2018) endorse using standard colours for links. I have used a purple rectangle
shaped navigational button with white text on each page for consistency. The recipe titles that links to
the recipe information will change colour from grey to black when the user hovers over or clicks on
them. This ensures the user knows what will happen when they commit to clicking on the link.

4|Page
Another way to aid users according to Lannon and Gurak (2015) is to have the search tool and contact
information easy to find. In my website these are available on all pages.

The W3C believe that the web is designed to work for all people and accessible to people with a
diverse range of abilities. They recommend providing alternative text for non-text content such as
graphics. This is helpful for people who are blind and use a screen reader and I will include these
when I am building the website. Markel and Selber (2018) propose that colour should not be relied on
to convey meaning or information as it will exclude people who are colour blind. In my website the
colour is secondary to the meaning of the content.

Accessibility can also be improved by good signposting. The National Adult Literacy Agency
(NALA) suggest using plenty of signposting, for example introductory paragraphs, headings,
subheadings and lists which I have incorporated into my design. I have also taken Lannon and
Gurak’s advice propose that text should be left justified and broken up into chunks with headings and
white space to make it easier to read (2015). I am using a untextured plain white background to make
sure text is accessible and easy to read.

To ensure the resource is useable for parents I have created a consistent approach to presentation of
each recipe which includes a photograph or the dish and important information at the top of the page.
Both ingredients and method are always visible together to ensure the user doesn’t need to switch
between pages during the cooking process, which can be very frustrating. I am also adding a printable
pdf file of the recipes to the resources section which users may choose to use for practical reasons
when they are in their kitchens. The content layout of this file will be consistent with the online
resource.

To create some user nteraction I have added a favourites function on the website. Users can click on
the icon under each recipe which adds the recipe with their ‘your favourites’ list in the resources
section. To maximise the potential number of users of this website I will use the metadata below when
developing in Adobe Dreamweaver.

Material Type: Website

Technical Format: HTML

Author: Sinead Wall

Submitter: Sinead Wall

Keywords: Recipes, family recipes, recipes for children, healthy eating, children’s
menus, school lunches, healthy snacks

5|Page
Primary audience: Parents living in Ireland

Technical requirements: Internet Browser

Language: English

6|Page
References
Accessibility (n.d.) W3C, available: https://www.w3.org/standards/webdesign/accessibility [last
accessed 10 Mar 2019]

Color-hex.com (2019), available: https://www.color-hex.com/color/8eb48b [last accessed 10 Mar

2019]

Lannon, J. and Gurak, L. (2015) Technical Communication, 13th ed., Harlow: Pearson.

Lee, W. and Owens, D. (2004) Multimedia-based Instructional Design, 2nd ed., John Wiley & Sons.

Markel, M. and Selber, S. (2018) Technical Communication, 12th ed., Boston: Macmillan Education.

Neilson, J. (2015) Legibility, Readability, and Comprehension: Making Users Read Your Words
Neilson Norman Group, available: https://www.nngroup.com/articles/legibility-readability-
comprehension/ [last accessed 09 Mar 2019]

Schriver, K. (1997) Dynamics in document design, New York: Wiley.

Writing and Design Tips (2011), National Adult Literacy Agency, available:
https://www.nala.ie/resources/writing-and-design-tips [last accessed 10 Mar 2019]

7|Page
Part 2: Storyboard

8|Page
9|Page
10 | P a g e
11 | P a g e
12 | P a g e
13 | P a g e
14 | P a g e