DIG22 INTERNET DESIGN INTRODUCTION
ASSIGNMENT 2 – PLANNING EXERCISE
Due: week 8
Introduction
After the completion and submission of assignment 1, the remaining two assignments for DIG22 will engage students in the design and execution of a single page scrolling HTML5 and CSS3 website based on a chosen project brief. The web design process typically involves 4 stages: Planning, Design, Development and Launch. This second assignment will focus on the Planning and Design stages of this process. More specifically, this will involve topic research, ideation, site planning and conceptualisation via the ‘Pre-production Document’. This document will then act as a blueprint to inform the execution of your final practical outcome in DIG22.
Learning Outcomes
Through the process of researching, planning and conceptualising you will:
- Gain an understanding of the important roles research and planning play in the successful execution of an effective web design solution.
- Understand and apply basic website usability and accessibility concepts in the design of a website using hypertext markup language (HTML5) and cascading style sheets (CSS3)
- Understand and navigate copyright issues relating to the use of media and content in a digital authoring environment.
Assignment 2 Minimum Requirements
Now that students have begun to familiarise themselves with the technical side of creating a website and some of what is involved in the research process they will create a comprehensive pre-production document around their chosen brief. This document will centre on ideation and planning. The pre-production document will consist of the following sections:
- Production schedule
- Topic/Brief Research
- Target Audience Research
- Sketchbook
- Layouts
- Fonts
- Images
- Colour schemes
- Mockups
- Full single page scrolling mockup
- Desktop
- Mobile
- Tablet
- Treatments & Rationales
- Personal reflection
- References
A. Production Schedule
Having a clear idea of the tasks ahead of you, and when they must be completed is an important aspect of the web designer’s process. Having a clear and carefully considered production schedule can assist you to stay on track, meet deadlines, and ensure that no task is overlooked.
There are a variety of methods for structuring and creating a production schedule. However, it is important for each student to find a scheduling method that works well for them.
B. Topic/Brief Research
Research is critical at this juncture in the design process. After selecting a project brief to base your project on, students will delve further into the research process by investigating their chosen brief topic. To be an effective web designer, you must understand the website topic/theme, your client and your target audience. Collate and summarise only the most relevant research information into your Research Folio. Please note that each reference source may only appear once in your research folio. (ie. You must endeavour to utilize a broad range of references.) Each reference source must include its full citation in Chicago Author-Date format and a description of how that research has influenced your own work/ideas.
C. Target Audience
Research is critical at this juncture in the design process. To be an effective web designer, you must understand not only the website topic, but also your target audience. Understanding your target audience will influence the choices you make and ultimately the effectiveness of your website in reaching and communicating with its intended group of users. Collate and summarise only the most relevant research information.
D. Sketchbook
The design process is an iterative one. As you conceptualize, refine and iterate upon your design ideas, you should use a sketchbook to document your design development. Some elements that should be contained within the Sketchbook include brainstorming, ideas generation, design development and visual design experimentation into the following specific areas:
- Layouts
- Fonts
- Images
- Colour Schemes
- Visual Style
If you wish to explore other interface elements, or component of web design you are welcome to do so, but students are encouraged to present their ideas in a clear and concise manner, including only the most pertinent information whilst still clearly conveying their design process thus far.
While working on your Sketchbook, you are free to choose the actual medium for your design development/experimentation. Some students may feel at ease with using Photoshop/GIMP to play around with potential design ideas for their sketchbook. Others may prefer to hand-draw sketches and/or use collage techniques with paper and glue to explore different design ideas. Whichever medium you choose, be sure to include pictures of your design development/experimentation in the provided Website Blueprint template.
E. Mockups
This component allows both you and your tutor (and/or a potential client) to clearly visualize what the proposed website design will look like. You must deliver a screen mockups depicting your proposed design. You can think of the screen mockups as non-interactive, but visually accurate ‘screen capture’ (ie. still image) versions of your website pages. Your mockup must be full colour ‘Screen Mockups’ depicting the exact colour scheme, navigation, image style, typefaces and layout of your website. Where appropriate, a description of any audio/video elements contained on the page should be indicated.
As you will be designing and developing a responsive website, you will be expected to create 3 mockups illustrating how your site will display across 3 devices: desktop, mobile and tablet.
Depending on the project brief you have chosen to pursue, at this early stage in production, some students may not have finalized the textual content for their website. In your screen mockups, you should endeavour to use your proposed page titles/headings, however you may substitute the actual textual content on each page with ‘placeholder’ text. Use a dummy text generator like: http://www.blindtextgenerator.com/lorem-ipsum to create the placeholder copy.
While you are not expected to include all the finalised images for your website in the screen mockups, you must include sample images that give your potential client and/or tutor a clear idea about what sort of pictures will be featured on the website.
You may not base your screen mockups on any existing templates or whole site designs. You must create your screen mockups from ‘scratch’, though you may utilize individual graphical / textual elements that have been created by someone else. Any such material must clearly be referenced in section H.
If you are unclear about these requirements, please discuss them with your tutor.
F. Treatments & Rationales
- Visual Treatment
During the pre-production stage of the web design it is important to articulate the various assets and resources you will use in your site. This could include images, typeface, colour scheme, images, branding elements, icons, visual hierarchy and more. The visual treatment section is where you should identify your final design choices.
- Visual Treatment Rationale
The ability to confidently and coherently rationalise your design choices is an important part of working with a client and the overall design process. The visual treatment rationale is where you should rationalise your final design choices. The design rationale is not based on a designer’s personal preferences, whims or fancies – it must be based on research into the website theme, its topic/content, target audience and relevant design theory. You will draw on the research you conducted in assignment 1, concepts discussed in the Weekly Study Materials, and additional research you have undertaken for assignment 2.
- Interactive Treatment
In this section students are expected to clearly identify and articulate at least 4 various interactions they intend on incorporating in their final website. Each intended interaction should be listed along with details on how it will work, how the user might engage with it (applicable to interactions primarily), where in your site it will be located, and any additional pertinent information you wish to include.
An interaction in the context of this assignment is defined as being any interface element within your design that requires your user to engage with in order for a subsequent event to occur. For example, rollover effects on navigation, back to top links, text input, etc.
Interactions should be relevant and meaningful with a clear purpose and link to the target audiences wants and needs.
- Interactive Treatment Rationale
See above, ‘Visual Treatment Rationale’
G. Personal Reflection
Taking time to reflect on the work you have done, identifying what you’ve done well and what could have been improved upon is crucial to the development of your skills in the area, and your understanding of the design field. In 2-3 paragraphs reflect on your progress to date.
H. References
A reference list should contain the full citations for all sources you reference throughout your Pre-production Document. The referencing style for this unit is Chicago. More information can be found on this style from the Library web site: http://libguides.library.curtin.edu.au/referencing
Deliverables:
- Your Pre-production Document saved in Adobe PDF file format.
Where to submit: On the unit Blackboard website, go to the ‘Assessments’ section of the site and scroll down to find the Dropbox for Assignment 2. Upload your assignment by the due date stipulated in the Unit Outline.
File Naming: The submitted PDF file must be called “A2-YourFullName.pdf”
Note: A2 stands for “Assignment 2”
Due date: Refer to Unit Outline and the Blackboard Assessment drop box description.
Late submissions without prior extension approval will be penalized at 10% per calendar day in accordance with university policy.
The post DIG22 INTERNET DESIGN INTRODUCTION appeared first on My Assignment Online.