Graphics & Web Design
|Credits:||10 (or 5 ECTS credits)|
|Organiser:||Dr Panagiotis Ritsos|
Overall aims and purpose
To develop students’ ability to produce high-quality designs, for the use in presentational materials, to be able to follow design principles to produce industry-standard, quality websites & to develop a basic knowledge of graphics theory & HCI.
How images are represented by a computer, basics of image storage & compression, different image formats, resolutions, display size, print size and interpolation.
Concepts of usability, user experience, information architecture and their relationship.
Design practices for the (mobile) web, including wire-framing, storyboarding and other lo-fi prototyping techniques
Human-Computer Interaction best-practice principles for web design, and human-perception concepts that influence graphical interface design
Learning outcomes mapped to assessment criteria
Understanding of user-centred design and HCI principles.
|Demonstrate an understanding of basic HCI principles and comment on what is / isn’t good design practice & provide examples.||Understands the reasoning behind current HCI principles and able to follow HCI guidelines consistently throughout work.||Able to extrapolate from HCI guidelines provided in order to reason about good design, navigational structure & clarity of presentation.|
Demonstrate an understanding of image theory, including aspects of colour theory and image compression
|Basic understanding of storage / compression techniques. Students should understand the difference between display size, colour, print size and how the quality of an image may be affected by these.||Good understanding of image storage & compression techniques. Furthermore, basic understanding of higher level concepts such as interpolation and colour perception.||Student should understand how images are represented by the computer and the tradeoffs involved in the use various image formats.|
Utilise graphics packages to produce & manipulate website templates and images to a high standard.
|Students are able to use graphics package functionality to put together templates and images for use in websites as well as to repair / adjust images to suit an intended purpose.||Able to develop website templates and graphics & manipulate image (e.g. reparation of photographs) to a standard which could be considered professional||Able to select the appropriate image format & optimise images bearing in mind the intended purpose of materials; able to produce higher quality work than might be expected at threshold.|
Display an understanding of various web design features & technologies such as forms, image maps, media, text/typography for a variety of display mechanisms and device form-factors
|Students should be able to utilise basic web design features to improve the clarity / communication of information as well as to lend interest to a website.||Students understand that browsers in different form-factor devices may not render mark-up in the same fashion & account for this; able to make use of more complex design functionality to compensate.||Students able to utilise all web design features & features shown and are able to utilise these for their own purposes to a high standard, for various form-factors.|
Demonstrate competence in use of web design strategies (e.g. wire framing, low-fidelity prototyping techniques ) for the production of high-quality websites and graphical-user interfaces.
|Students demonstrate good judgement in presenting information and navigational structure. User experience recommendations and best practices used to enhance quality of work.||High standard of work produced which follows best practice HCI guidelines & fundamental model of user-centred design for the web.||Students should be able to use web design strategies to produce a website prototype of a higher standard than could be achieved without such techniques.|
|Web Audit of the School of Computer Science Website||30|
|Designing a Responsive Website||40|
|Website Redesign using Low fidelity Prototyping||30|
Teaching and Learning Strategy
11 hours over 12 weeks
24 hours over 12 weeks
ASSESSED assignments, including tutorial questions, problems, essays etc.
- Computer Literacy - Proficiency in using a varied range of computer software
- Self-Management - Able to work unsupervised in an efficient, punctual and structured manner. To examine the outcomes of tasks and events, and judge levels of quality and importance
- Exploring - Able to investigate, research and consider alternatives
- Information retrieval - Able to access different and multiple sources of information
- Critical analysis & Problem Solving - Able to deconstruct and analyse problems or complex situations. To find solutions to problems through analyses and exploration of all possibilities using appropriate methods, rescources and creativity.
Subject specific skills
- Knowledge and understanding of facts, concepts, principles & theories
- Use of such knowledge in modelling and design
- Problem solving strategies
- Deploy theory in design, implementation and evaluation of systems
- Knowledge and understanding of commercial and economic issues
- Knowledge of management techniques to achieve objectives
- Specify, design or construct computer-based systems
- Evaluate systems in terms of quality and trade-offs
- Deploy tools effectively
- Development of general transferable skills
- Defining problems, managing design process and evaluating outcomes
- Principles of appropriate supporting engineering and scientific disciplines
Pre- and Co-requisite Modules
Courses including this module
Compulsory in courses:
- I110: BSc Computer Information Systems year 2 (BSC/CIS)
- G400: BSC Computer Science year 2 (BSC/CS)
- GN41: BSC Computer Science for Business year 2 (BSC/CSFB)
- I102: BSc Computer Science (with International Experience) year 2 (BSC/CSIE)
- GW49: BSC Creative Technologies year 2 (BSC/CT)