Unit 12 - LO3 - Power point Delivery

advertisement
Assessment Criteria
Learning Outcome
Pass
Merit
Distinction
The learner will:
The assessment criteria are the
pass requirements for this unit
The Learner can:
To achieve a merit the
evidence must show that, in
addition to the pass criteria,
the learner is able to:
To achieve a distinction
the evidence must show
that, in addition to the pass
and merit criteria, the
learner is able to:
1 Understand web
architecture and
components
P1 Outline the web architecture
and components which enable
internet and web functionality
2 Understand the
factors that influence
website performance
P2 Explain the user side and
server side factors that
influence the performance of a
website
P3 Explain the security risks and
protection mechanisms
involved in website
performance
M1 Compare and contrast
current interactive
websites for performance
and security
D1 Discuss the impact that
cases of website security
breaches have had on
society
3 Be able to design
websites
P4 Using appropriate design
tools, design an interactive
website to meet a client need
M2 Produce annotated
design documentation for
an interactive website to
meet a client need
4 Be able to create
websites
P5 Create an interactive website
to meet a client need
M3 Implement CSS in an
interactive website to
improve the site to meet a
client’s needs
D2 Carry out acceptance
testing with client on an
interactive website
Assessment Criteria P4 and M2
 For assessment criterion P4, learners must work to an identified brief and
clearly identify the purpose of the website and who the target audience is.
A scenario can be provided but it is important not to make it too restrictive
so it hinders creativity.
 Learners should create a specification document which clearly identifies
what will be included, the client needs, security, costs and user needs. The
learner should create a time plan with appropriate deadlines to follow the
design, creation and testing phases of the project. The learner should plan
a website of at least eight pages. Designs should include a mood board,
navigation map and storyboards. They should clearly show an appropriate
method of navigation, details of styles to be used, and at least three
multimedia and interactive elements to be incorporated.
 Merit criterion M2 is an extension of P4. The learner must produce
annotated designs and layouts for a minimum of eight web pages.
Navigation maps should be accurate and storyboards should be detailed and
annotated with all elements and assets to be used clearly identified with
references to sources, appropriate layouts, links, colour schemes and font
styles stated. Learners should ensure they have considered the clients needs
carefully and can include in their annotation how their designs meet the
identified user’s needs.
LO3 Be able to design websites – Website Specification
 In order to specify the needs of our website the client would like an




analysis of current websites and the similar themes that are present
in their production. On e-commerce sites there is usually
shopping baskets, pages of sales details, contact details, selective
checkouts etc. that are consistent with this type of site.
Similarly educational sites have similar themes, age appropriate
content, directed guidance, step by step training rather than a single
page theme etc.
Promotional sites tend to be more specific to the product, product
details, release dates, prices, adaptations, charges. For sites such as
film reviews the details tend to be about similar themed films, films
the stars have been in the past, release dates, plot lines etc. For
Game Release sites, the language is the same, “From the makers of…”
P4.1 – Task 01 – Analyse three websites that have a similar themes,
education, promotional or e-commerce, evidence and list with an
explanation the recurring content within these categories.
Think about how the structure of the design and the inclusion of
content can vary based on the different purposes.
LO3 Be able to design websites – Website Specification
 In terms of client demographics, the international versions of your
reviewed websites will be different. Coca Cola global will house the same
information such as pricing as Coca Cola UK. The language used will be
different, the terms, the client. For most international sites the target
audience is suppliers, those with industry knowledge, those with a link to
the business that needs something from the company that the UK version
is unlikely to hold. Loom at the customer information on Topshop and
compare it to Arcadia, look at Ben and Jerry’s and compare it to Unilever,
Beechams site compared to Glaxo Smith-Kline Wellcome.
 Similarly poorly designed, less professional versions of your companies
rivals will have a lot of similarities and differences to your chosen
companies. It might be the colour scheme, the layout, the ease of use, the
reduced product range.
 P4.1 – Task 02 – Using three poor alternatives and three international
websites that have a similar theme to your 3 sites, evidence and discuss the
similarities and differences in the content and design.
 Think about how the structure of the design and the inclusion of content
can vary based on the different purposes.
LO3 Be able to design websites – Website trends
 They say that the internet changes all the time but these trends tend to be
subtle. Game sites when they first started were all about hints and tips,
compliments of the magazines that were distributed but in recent times
game sites have replaced magazines to centre on one form of content for
the user. Game trailers for instance corners the market in videos, Gamehub
on game support, Joystiq.com on reviews.
 Similarly technical magazines such as 3DWorld used their site as a
compliment to their publishing but now uses their site for content now
available in the magazine. Facebook was designed for personal use and is
now a focus for business promotion, IMDB was there for information and
is now used as movie promotion and industry database access. Some sites
are the same as they have ever been, eBay for selling, Amazon and Game
for purchasing, Microsoft for user support and content.
 P4.1 – Task 03 – Research current trends in web design and consider their
appropriateness.
 In this analysis consider for each site what the needs of the client, and the
user might be, as well as looking at methods of interactivity used by these
sites to gain the customers appeal.
LO3 Be able to design websites – Website production tools
 Clients expect results and usually do not consider what it takes
to get there. The different methods of designing is there for
the website designer to prepare those results. There are design
tools that are sued to benefit the designer specifically is the
website plan changes or the user requires additional materials
or content.
 Mood boards consider how information flows, how the user
gets from the starting page to the conclusion of their search
making use of alternative pathways to find that information.
They give rise to ideas, allow the designer to add additional
content to the design and link it through critical pathing.
 P4.2 – Task 04 – Describe the purpose and benefits of using
mood boards in website production and using an existing ecommerce website, design 3 Moodboards to describe the path
to Checking out, Finding Support and Researching product
information and comparison.
Checking out
Finding Support
Researching product information and comparison
LO3 Be able to design websites – Website production tools
 Navigation Maps consider how a website is structured, the
hierarchy of needs and how each page of a website links to
other pages. They also show how the user needs to navigate in
order to find information in a logical form rather than leaping
straight on the page without history.
 Too many links on the home page can be confusing to the user
and makes the website less professional. Having links to
everywhere on a homepage is similar to every book in a library
sorted in alphabetical order. The user needs to be guided to a
page and maintain a themed search from within a site.
 P4.2 – Task 05 - Describe the purpose and benefits of using a
navigation map in website production and using an existing ecommerce website describe and create a navigation map of its
products and services.
LO3 Be able to design websites – Website production tools
 A Housestyle page and stylesheet is the main basis of a companies
consistent website design. It allows the user to expect where things will be,
how to navigate, how to rely on consistency to find things. For a company it
is how they add more content with the least amount of work. Why redesign
the page, set up the fonts, start from a blank canvas every time a new page
is added. If Amazon want to create a site for North Korea, it would use the
same design and template it has for America or France, the same colour
scheme, the same layout, the same menus, the same logo, fonts, sizes,
colours, the same accessibility options and CSS styles. Only the language
and product base will need to change. And if they have a new product
range, copy and paste, add a link and upload, done.
 Look at any good website and you will see that they have a consistency in
terms of designs right down to the number of columns used and site map
links.
 P4.2 – Task 06 - Describe the purpose and benefits of using a Housestyle
Page and Stylesheet in website production and using an existing ecommerce website describe and create a housestyle diagram of its main
user pages.
 In the description you need to mention, font, size, colour, location of
elements, logo, inclusion of site map, column layout, accessibility options,
navigation buttons and menus.
LO3 Be able to design websites – Website production tools
 Storyboards are the main source of prepared materials used by
design companies to describe to a client how the finished site will
look. These are usually an extension of the house style page but
outlines additional elements that are necessary if the planned
production is to be given over to another company. This is usually
the last stage of prepared materials necessary before starting the
website creation and the more accurate they are, the more precise
and trouble free the website production should be.
 Storyboards are used for all kinds of production projects, films,
animations, advertisements etc. The are most effective when they
are adhered to. They should impress a client, they should state the
elements and the source location of those elements.
 P4.2 – Task 07 - Describe the purpose and benefits of using a
Storyboards in website production and using an existing ecommerce website describe and create a storyboard design of its
main user pages.
 In the designs you need to include 8 pages such as the home page,
shopping page, information page, checking out page, help page,
search results page, site map page and creating an account page.
LO3 Be able to design websites – Website Specification
 Client needs (e.g. appropriate image, relevant content for








website, admin/customer security and passwords, search
engine listing, setup/development/maintenance costs)
Security needs
Costs
User needs (e.g. user friendly navigation, age appropriate
content)
• planning (e.g. time plan, deadlines).
• purpose
• e-commerce
• educational
• promotional.
Areas to Cover
Focusing on designing and planning a website (at least 8 pages)
for your local business, you need to cover the following 8 tasks
within this case study:
What you need to cover:
1.
Purpose, Audience and User Needs
2.
Action Plan
3.
Mood board
4.
Site Plan for the New Website
5.
House Style
6.
Inclusion of Multimedia Content
7.
Page Plans (Storyboards)
LO3 Be able to design websites – Website Purpose and Audience
Choose a local business that you have an interest in, examples could include:
 A business with registered customers.
 A charity with sponsored needs and registered contributors.
 A physical area – perhaps for bookings, visitors and tourists.
Your client needs a website, they will need to have a customer base that registers on this
site for future reference and for purchasing needs. Personal details will be stored so
protection methods will need to be in place such as SSL. Your client will have a brief
and expectations from this site in the hope that it will take care of 40% of their business
needs and will compliment their off-line business needs but not replace it. The client
needs to have both an online and offline presence where the same quality of support
will be given to both customer bases.
P4.3 – Task 08 - Describe the purpose, audience and user needs for your website
proposal.
Security Needs and Costs
Purpose
Audience
Multi Media Content and Interactive Features
M2.1 – Task 09 - Describe the Multimedia Content and Interactive Features that
will need to be included to meet the audience needs and how their inclusion will meet
the identified user’s needs.
LO3 Be able to design websites – Action Plan
P4.3 – Task 10 - Create an action plan explaining exactly what you intend to
do and when - Use the template below
Task
Number
1
Task
Prerequisites
Create navigational
site map to show all
of web pages to be
created.
None
<<is there a task that
needs to be
completed before
this task can be
performed – for
example before you
can produce the
pages you must
design them>>
Start Date
12/12/2009
Finish Date
12/12/2009
Resources
Needed
Computer,
Word,
Printer.
Comments
Feedback on Task
This will be created
in Word using
auto-shapes or text
boxes. It will
indicate the
navigational
directional
<<Will contain
information about
how the task was
completed was it
done, on time,
what lessons were
learnt and any
other important
information>>
2
This is a live document and as such will need to be completed as and when you complete tasks –
explaining your views on the task.
Pass – brief plan of the website identified
 List a feature that they will use to help
website met the clients needs
 A list of tasks to be carried out, mind
maps and simple page plans for the
website including possible use of links
Merit – detailed proposal for the website identified
 Detailed explanation for at least three multimedia features that
will help website meet the clients needs.
 Detailed action plan that identifies all tasks to be completed, dates
and actions
 Plans will all be accurate
M2.2 – Task 11 - Create an action plan explaining critically comments and feedback on
the completed task with suggested improvements.
LO3 Be able to design websites – Mood Boards
The client needs proof that the completed webpage will be suitable for
purpose. They need to see how the website can be used by the customers to
navigate and interact with so they can be sure all the functions can be utilised
effectively. For this the client will need to see the active designs for the site.
P4.3 – Task 12 - Create 3 mood boards explaining how you intend for your
customers to navigate from the home page to checkout or booking, to user
support and to search results.
For Mood Boards to work well they should allow the user room for mistakes
and correct these mistakes without the need to return to the home page to
start again. This can be done through the use of a site map or alternative
pathing within the web page.
M2.2 – Task 13 - Create a critical path and alternative set of connections on
the mood boards to allow the user to determine their own solution.
LO3 Be able to design websites – Site Plan
P4.3 – Task 14 - Create a Site Map for your website design. For each page
you need to describe its purpose and what it will contain to meet that
purpose.
REMEMBER: you need at least 8 pages
1 - Home /
about
2- Accessibility
options
3 - DVD’s
5 - Customer
Feedback
6 - How to
order
4 - Computer
Games
M2.3 – Task 15 - Describe in detail each page’s purpose and what
multimedia content it will contain to meet that purpose and audience.
LO3 - Be able to design websites – House Style
P4.3 – Task 16 - Illustrate and explain the house style for your website
 This should be generic enough so that all of your pages can follow it
 You need to detail everything on the page, fonts, sizes, colours,
background colours, accessibility options, site map, location of
navigation system, logo, additional or external links.
Background Colour
 A Pass example is given below.
will be ?
House Style
Headings = Times new roman size 24
Subheading = Times new roman size 20
Text = Times new roman size 14
All Text colour = black
LOGO
Subheading, FSC
Links
Multimedia
component
Text, FSC
Text,, FSC
Link to ?
Link to ?
Multimedia
component
Text, FSC
Text, FSC
Link to ?
Multimedia
component
Text, FSC
Text, FSC
Page colour = White
M2.4 – Task 17 - Illustrate and explain the
house style for your website in detail
outlining all features that are consistent on
every page.
Heading, FSC
Email links
External link , FSC
Link to ?
This example just for illustrative
purposes and is not complete
LO3 - Be able to design websites – Multimedia Content
You need to plan for the inclusion of at least three forms of Multimedia or
Interactive Content on your website to make it more audience friendly.
 Some examples include:
 Button to alter font size
 Colour changer
 Language selection changer
 Google Location Map
 Mobile Friendly Button
 Login and User Account option
 Interactive or Dynamic Banner Ad
 Alt tags which describe multimedia content that may not appear on
certain devices used to access the Internet
Pass – THREE features identified and
described
Merit – At least FOUR features identified
and described
P4.3 – Task 18 - Describe in detail the Multimedia features you plan to
include in your website. Explain how this will benefit the target audience.
LO3 - Be able to design websites – Page Plans
P4.3 – Task 19 - Describe a detailed sketch diagram of how each page is
going to look like with the House Style identified
 You will need to explain how each page will look and what it will contain
 It should be detailed enough so that a third party could implement your
designs
All links are flash
buttons – blue
LOGO
warper
Links
This example
just for
illustrative
purposes and
is not
complete
Page Information
The Digital Realm
Links internal = Home, CDs, DVDs,
Order.
Links External = Metacritic.com,
www.google.com
Computer Games
Home
Image of World of
Warcraft box art
Description of
game
Price and
availability
Accessibility
Image of Wii Sports
Resort box art
Description of
game
Price and
availability
Accessibility features = Alt tags,
altered text size / background
colour.
DVD’s
Image of Gears of
War 2 box art
Description of
game
Price and
availability
Meta tags = computer games Wii
Xbox PC
Order
Email link to sales
Email link to customer service
Pass – Simple page plans identified
External link to Google
External link to metacritic
Merit – Detailed page plans identified with source
references given
Assessment Tasks
P4.1 – Task 01 – Analyse three websites that have a similar themes, education, promotional or ecommerce, evidence and list with an explanation the recurring content within these categories.
P4.1 – Task 02 – Using three poor alternatives and three international websites that have a
similar theme to your 3 sites, evidence and discuss the similarities and differences in the content
and design.
P4.1 – Task 03 – Research current trends in web design and consider their appropriateness.
P4.2 – Task 04 – Describe the purpose and benefits of using mood boards in website production
and using an existing e-commerce website, design 3 Mood boards to describe the path to
Checking out, Finding Support and Researching product information and comparison.
P4.2 – Task 05 - Describe the purpose and benefits of using a navigation map in website
production and using an existing e-commerce website describe and create a navigation map of its
products and services.
P4.2 – Task 06 - Describe the purpose and benefits of using a House style Page and Style sheet
in website production and using an existing e-commerce website describe and create a house
style diagram of its main user pages.
P4.2 – Task 07 - Describe the purpose and benefits of using a Storyboards in website
production and using an existing e-commerce website describe and create a storyboard design of
its main user pages.
P4.3 – Task 08 - Describe the purpose, audience and user needs for your website proposal.
M2.1 – Task 09 - Describe the Multimedia Content and Interactive Features that will need to
be included to meet the audience needs and how their inclusion will meet the identified user’s
needs.
Assessment Tasks
P4.3 – Task 10 - Create an action plan explaining exactly what you intend to do and when
M2.2 – Task 11 - Create an action plan explaining critically comments and feedback on the
completed task with suggested improvements.
P4.3 – Task 12 - Create 3 mood boards explaining how you intend for your customers to
navigate from the home page to checkout or booking, to user support and to search
results.
M2.2 – Task 13 - Create a critical path and alternative set of connections on the mood
boards to allow the user to determine their own solution.
P4.3 – Task 14 - Create a Site Map for your website design. For each page you need to
describe its purpose and what it will contain to meet that purpose.
M2.3 – Task 15 - Describe in detail each page’s purpose and what multimedia content it will
contain to meet that purpose and audience.
P4.3 – Task 16 - Illustrate and explain the house style for your website
M2.4 – Task 17 - Illustrate and explain the house style for your website in detail outlining all
features that are consistent on every page.
P4.3 – Task 18 - Describe in detail the Multimedia features you plan to include in your
website. Explain how this will benefit the target audience.
P4.3 – Task 19 - Describe a detailed sketch diagram of how each page is going to look like
with the House Style identified.
Download