Applied Art for the Web
Introduction
Course code : DESI1182
Course co-ordinator : David Watson
Course tutor : Prisca Schmarsow
Course weighting : 40 credits
Course details : eyelearn
In order to deliver a good user experience ~ any web site needs to meet a number of criteria, be visually engaging, work flawlessy and intuitively and remain accessible to the widest audience possible. While the technical aspects will need careful consideration and be executed well ~ the design itself also needs to deliver. Only when all components come together to form the end product will it succeed.
This course’s focus is on the design aspect of this process. Information design, graphic design, interaction design, branding, typography, photography and incorporation of other media (such as audio and video) all play a part in the creation of the website’s design and production. You will study aspects of good design and analyse and apply the concepts involved to your own projects. It’s all about learning to look, to really see and recognise good design. Critical analysis of your own as well as others’ work will improve your design skills.
Aims
The course develops a framework for critical and analytical thinking and working practice. It aims to introduce and evaluate the search for balance between the aesthetic aspects and the functional considerations of online projects. Discussing core principles of graphic design and considering how they apply to the web – the course will focus on principal topics such as composition, colour theory, typography and grids systems, developing creative thinking and problem solving skills.
You will be encouraged you to research and study good online design and apply your findings and conclusions to your own work. You will explore creative solutions to design problems and begin your collection of references and sources of inspiration.
Learning Outcomes
On completing this course, students will:
- be able to work effectively with imagery for use within websites
- have a good understanding of composition and presentation techniques for visual information on the web
- be able to work with image-editing software to create and optimise visual assets for online use
- be able to apply graphic design principles to web projects
- understand the history of typography and how to apply contemporary typographic principles to websites
- develop an approach and language for the critical appraisal of websites
- be aware of the principles of grid systems and be able to work with grids for page layout and content presentation
- be able to apply the principles of good interface design to website design
- have a good understanding of colour theory and be able to implement appropriate colour schemes for visually engaging as well as accessible design solutions for the web
- understand the principles of information design and how they relate to websites
- have a good understanding of the concepts of branding and brand building
- understand the implications and considerations for embedding audio and video to webpages and be able to find creative solutions in their presentation
Indicative Content
Each session focuses on a specific, relevant area of the applied arts and provides an understanding of the general principles and how these may be applied to the web. At each stage, a critical appraisal of appropriateness, quality of implementation and aesthetics is made. Topics covered in the course include Typography, Animation, Photography, Interaction Design and various aspects of Graphic Design.
The face-to-face sessions are designed to expose students to a range of creative graphic design topics and to give critical feedback on project work.
Course Schedule
The course schedule gives an overview of the timetable, weekly topics and submission dates for this course. There may be occasional changes, so check back frequently.
Full-time & part-time, second year students
| Date | Room | Title |
|---|---|---|
| 9th Oct 2014 (am/pm) | 1014/1016 | Bitmap images: core skills |
| 16th Oct 2014 (am/pm) | 1014/1016 | Bitmap images for the Web |
| 23rd Oct 2014 (am/pm) | 1014/1016 | Web Thesis Project |
| 30th Oct 2014 (am/pm) | 1014/1016 | Typography for the Web #1 |
| 6th Nov 2014 (am/pm) | 1014/1016 | Layout design (grids) |
| 13th Nov 2014 (am/pm) | 1014/1016 | Vector images: core skills |
| 20th Nov 2014 (am/pm) | 1014/1015 | Web Thesis Project |
| 27th Nov 2014 (am/pm) | 1014/1016 | Adaptive design planning |
| 4th Dec 2014 (am/pm) | 1014/1016 | Typography for the Web #2 |
| 11th Dec 2014 (am/pm) | 1014/1015 | Web Thesis Project |
| 18th Dec 2014 | Self Study | |
| Winter Vacation (2 weeks) | ||
| 8th Jan 2015 | Self Study | |
| 15th Jan 2015 (am/pm) | 2007/2008 | Principles of graphic design #1 |
| 22nd Jan 2015 (am/pm) | 2007/3003 | Principles of graphic design #2 |
| 29th Jan 2015 (am/pm) | 2007/3003 | Branding design |
| 5th Feb 2015 (am/pm) | 2007/3003 | Web Thesis Project |
| 12th Feb 2015 (am/pm) | 2007/2008 | Interface design |
| 19th Feb 2015 (am/pm) | 2007/3003 | Web Thesis Project |
| 26th Feb 2015 (am/pm) | 2007/2008 | Web Thesis Project |
| 5th Mar 2015 (am/pm) | 2007/3003 | Web Thesis Project |
| 12th Mar 2015 (am/pm) | 2007/2008 | Colour |
| 19th Mar 2015 (am/pm) | 2007/2008 | Icon design |
| 26th Mar 2015 (am/pm) | 2007/2008 | Web Thesis Project |
| 2nd Apr 2015 (am/pm) | 2007/2008 | Web design for UX and accessibility |
| 9th Apr 2015 | Self Study | |
| 16th Apr 2015 | Self Study | |
All face-to-face sessions are 3 hours long and take place on Thursday mornings (am); beginning at 10.00am or afternoons (pm); beginning at 2.00pm unless otherwise indicated.
See the programme teaching schedule for an overview of all courses.
Course Documents
There are currently 9 files in this section
| Filename | Size (KB) | Date Modified | |
|---|---|---|---|
 |
A Critique of your competitors.pdf | 39.9 | 27th Aug 2019 |
|
Flash tutorials.pdf | 8,354.9 | 27th Aug 2019 |
|
Graphic Design Fundamentals.pdf | 6,772.1 | 27th Aug 2019 |
|
Photographic composition.pdf | 3,836.5 | 27th Aug 2019 |
|
Photoshop Creating Buttons (sample chapter).pdf | 4,117.5 | 27th Aug 2019 |
|
Web Typography 1.pdf | 920.9 | 27th Aug 2019 |
 |
Web Typography 1.ppsx | 1,585.9 | 27th Aug 2019 |
|
Web Typography 2.pdf | 830.2 | 27th Aug 2019 |
|
Web Typography 2.ppsx | 1,590.8 | 27th Aug 2019 |
Key Texts
There are now many good books available that cover the topics within this course but the ones below are those that we think work best.
Essential Text Books
- Designing with Web Standards (3rd Ed.) by ¦ details
- The Zen of CSS design: visual enlightenment for the web by ¦ details
- The Elements of Typographic Style by ¦ details
- A Practical Guide to Designing for the Web by ¦ details
- Adaptive Web Design by ¦ details
- Ordering disorder: grid principles for web design by ¦ details
- Design Basics Index by ¦ details
- Design Elements: A Graphic Style Manual by ¦ details
- Basics Photography: Composition by ¦ details
- Distinctive Design by ¦ details
Further Reading
- The Icon Handbook by ¦ details
- Information is Beautiful by ¦ details
- MTIV: process, inspiration and practice for the new media designer by ¦ details
- Hardboiled Web Design by ¦ details
- Sexy Web Design by ¦ details
Essential Text Books
Designing with Web Standards (3rd Ed.) by Jeffrey Zeldman
This is a very important book. In Designing with Web Standards, Jeffrey Zeldman describes the way websites were coded in the twentieth century, clearly explains why this is now wrong and demonstrates how twenty-first century websites should be coded. The common perception is that designing websites to web standards is onerous for the designer and transparent to the user - naturally, many designers choose to ignore web standards. Zeldman demonstrates that working with standards, creating semantically correct XHTML in conjunction with structural CSS is, in fact, liberating rather than oppressive.
Some may fear that this book will give them a hard time and that Zeldman (standards guru) will push web standards for the sake of web standards. Nothing could be further from the truth. Zeldman is himself a website designer and as such, he delivers a very pragmatic approach to coding. The examples in the book are mainly based upon XHTML 1.0 Transitional (not Strict). Zeldman even covers the use of tables for page structure, heresy to most hard-line standards coders. The truth is that Zeldman is the best sort of evangelist. One who tells you it's OK not to go by the book if that seems impractical and you won't burn in hell as a consequence.
The book is also very instructive in the way it describes the development of web browsers and helps the reader to make sense of the many peculiarities that some browsers exhibit.
This may all sound rather dull but Zeldman has a very personable approach to technical writing. He is aware of the arcane nature of much of his subject matter and does a very good job of making it accessible and occasionally humorous.
This book has changed the way many web designers think and design. Whether you are a web design beginner or a seasoned professional, this book must be read; it will help you form opinions on web coding and will certainly help you to create better sites.
Designing with Web Standards (3rd Ed.) is available at Amazon.co.uk
Preview Designing with Web Standards (3rd Ed.) at Google Books
Greenwich library: 10 copies ~ view catalogue entry
The Zen of CSS design: visual enlightenment for the web by Dave Shea and Molly Holzschlag
No review has been written for this book.
The Zen of CSS design: visual enlightenment for the web is available at Amazon.co.uk
Preview The Zen of CSS design: visual enlightenment for the web at Google Books
Greenwich library: 6 copies ~ view catalogue entry
The Elements of Typographic Style by Robert Bringhurst
No review has been written for this book.
The Elements of Typographic Style is available at Amazon.co.uk
Greenwich library: 1 copies ~ view catalogue entry
A Practical Guide to Designing for the Web by Mark Boulton
It's probably fair to say that Mark Boulton's book has now reached the status of “classic text”. Essentially, it's a graphic design primer for web designers and is an ideal first read on the subject for anyone with little or no experience of visual design. The book contains no code and is not tied to any particular web technology and as such is an excellent generic guide to typography, colour and layout. The book also considers the design process and the development of design ideas.
Although the book can be bought in hard copy and eBook form from Five Simple Steps, it is also available to read for free.
See more information about A Practical Guide to Designing for the Web
A Practical Guide to Designing for the Web is available at Amazon.co.uk
Greenwich library: 6 copies ~ view catalogue entry
Adaptive Web Design by Aaron Gustafson
No review has been written for this book.
See more information about Adaptive Web Design
This title is not currently available from the Greenwich library
Ordering disorder: grid principles for web design by Khoi Vinh
No review has been written for this book.
Ordering disorder: grid principles for web design is available at Amazon.co.uk
Greenwich library: 8 copies ~ view catalogue entry
Design Basics Index by Jim Krause
This book is the perfect graphic design primer for those who have never previously had to think about where and how objects should be placed on a page. The book is designed as a quick reference but can easily be read through from start to finish (recommended). It covers all of the basic components of graphic design such as colour, image, typography, and the grid but it also takes a detailed look at various concepts such as hierarchy, flow, grouping and proportion.
This is a comprehensive but compact and accessible book. It is written in a clear and informal style and along the way there are numerous exercises for the reader that help to create a better understanding of the topics being discussed. Needless to say, the book itself is beautifully designed. All design students should read this book.
Design Basics Index is available at Amazon.co.uk
Preview Design Basics Index at Google Books
Greenwich library: 9 copies ~ view catalogue entry
Design Elements: A Graphic Style Manual by Timothy Samara
Timothy Samara's book is a primer that illustrates and discusses all the basic principles of graphic design in a direct and easily digestible format. The book consists of 5 chapters; “Form and Space”, “Color Fundamentals”, “Choosing and Using Type”, “The World of Image” and “Putting it All Together”. Each one is lavishly illustrated with excellent examples that clearly illustrate the topic under consideration. Although the book is not specifically targeted at web designers, it covers the universal principles of graphic design that are as applicable to web design as they are to traditional analogue media design.
In addition to the 5 chapters, the reader will learn the author's “Twenty Rules for Making Good Design”, a very good checklist of what to do and what to avoid. Although a book of this nature cannot contain everything that may be relevant, this book comes close and is the best one-volume introduction to graphic design I have seen.
Design Elements: A Graphic Style Manual is available at Amazon.co.uk
Preview Design Elements: A Graphic Style Manual at Google Books
Greenwich library: 12 copies ~ view catalogue entry
Basics Photography: Composition by David Präkel
No review has been written for this book.
Basics Photography: Composition is available at Amazon.co.uk
Greenwich library: 8 copies ~ view catalogue entry
Distinctive Design by Alexander Dawson
No review has been written for this book.
Distinctive Design is available at Amazon.co.uk
Preview Distinctive Design at Google Books
Greenwich library: 5 copies ~ view catalogue entry
Further Reading
The Icon Handbook by Jon Hicks
No review has been written for this book.
See more information about The Icon Handbook
This title is not currently available from the Greenwich library
Information is Beautiful by David McCandless
No review has been written for this book.
See more information about Information is Beautiful
Information is Beautiful is available at Amazon.co.uk
Greenwich library: 4 copies ~ view catalogue entry
MTIV: process, inspiration and practice for the new media designer by Hillman Curtis
No review has been written for this book.
MTIV: process, inspiration and practice for the new media designer is available at Amazon.co.uk
Greenwich library: 9 copies ~ view catalogue entry
Hardboiled Web Design by Andy Clarke
So much of contemporary web design is about technique. Some may feel that the way we apply the various technologies like HTML and CSS is rule-driven but that's not the case. Of course we have a bunch of technology building blocks and there are rules about they way they are used but an understanding of the rules is only the start of the journey. Web designers also need to understand the way the rules are interpreted, what are the accepted practices and how all this understanding should be applied in order to create websites to a professional standard. Fortunately for us, Andy Clarke's Hardboiled Web Design gives us the information we won't find in the rule books.
The book was published in 2010, and I've heard Andy say that it is already out of date. Certainly, it doesn't address responsive web design but there is still enough here to make it a valuable read for those trying to understand the complexities of contemporary web design.
See more information about Hardboiled Web Design
Hardboiled Web Design is available at Amazon.co.uk
Greenwich library: 6 copies ~ view catalogue entry
Sexy Web Design by Elliot Jay Stocks
No review has been written for this book.
See more information about Sexy Web Design
Sexy Web Design is available at Amazon.co.uk
Greenwich library: 8 copies ~ view catalogue entry