2. The 5 Planes Model Last session we looked at Content. By now we know why weâre bulding our site(site objectives) who weâre building it for (user needs/ accessibility) what weâre going to say (content) This session we will be looking at Functionality (what weâre going to build).
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
Hinweis der Redaktion
This is an opportunity to recover any aspects that people found difficult last session. Point out that we are still on the scope section of the diagram. Ask students what they think functionality means.
At this stage of designing a site, students should see an endless number of possibilities. Functional requirements are about honing down what we want to what we need. The initial iteration of the site should concentrate on getting essential information and services over, anything that seems like a good idea or âmight be niceâ should be left until later. By documenting what will be built we know when weâre finished.
A requirement is a short description of a single feature the site is required to have.
This is our first mention of stakeholders. When dealing with any organisation, itâs important to make sure that anyone who has an interest gets a chance to voice their opinion. Ask students who they think a stake holder might be (more on the next slide)
Stress the importance, if the production manager is not interested in the site then they will never get what they want out of it. By positively including them and encouraging their ideas, you will build the right product for them.
Each one feeds into the next. Explain to students that it is down to their expertise to guide clients to a workable and realistic set of requirements.
It is important to ask clients to consider what they want. The website should aim to become the most visual presence of the company.
These are discusse din greater detail on the following slides.
The bigger the project and the more money at stake, the more likely students will use these extended methods. The reality is that most âone person bandâ designers are unable to devote the time and resources for these methods.
Again, the students are unlikely to use surveys unless they work on larger projects. There are many useful free survey tool sites, one of them is survey monkey http://www.surveymonkey.com/ Card sorting is useful although it is time and resource consuming.
Prototypes can be built in Photoshop, Flash or Dreamweaver to give an idea of what will be produced and gives stakeholders a chance to veto anything they donât like.
As a continuity break, ask students to spend 5 minutes discussing when they might need different methods and what they see as the positive and negative aspects of each. We will move onto CSS.
This is a moment to discuss the concept of standards. The basic premise is that if all sites conform to the standards set out then, in theory, any browser on any platform will be able to read pages in the same way.
Itâs important here that students have a rough understanding of how CSS works, take time to explain and ensure that they âget itâ. The next few slides go into greater depth but try not to over complicate.
Separating style from content naturally helps with accessibility. This is the perfect opportunity to run through CSS zen garden at http://www.csszengarden.com/ The content on these pages never change, it is simply the style sheets.
Explain that there will be a CSS session in the course but it will only be able to cover the basics. The one thing we can discuss (next slide) is what it can be used for.
Fonts, remind students that if they use a particular font then they have to be relatively sure that the font is available on all systems. Colours will be covered in more detail in other areas of the course. Backgrounds. In terms of pictures and colours. Point out that images are changed regularly on the zen garden site. Positioning â will be covered in detail on the next slide.
CSS allows liquid layouts. Explain to students that a fixed layout will not change when the browser window is resized whereas a liquid layout adapts itself to the viewing habits of the user. A liquid layout example : http://www.maxdesign.com.au/presentation/liquid/example01.htm A fixed-width layout example: http://www.maxdesign.com.au/presentation/liquid/example03.htm
If students want to be successful in industry, it is up to them to learn CSS.