Course Title: Design web environments
Part B: Course Detail
Teaching Period: Term2 2014
Course Code: COSC5949C
Course Title: Design web environments
School: 345T Media and Communication
Campus: City Campus
Program: C6087 - Advanced Diploma of Screen and Media
Course Contact : Program Administration
Course Contact Phone: +61 3 9925 4815
Course Contact Email:firstname.lastname@example.org
Name and Contact Details of All Other Relevant Staff
Ph: 9925 4815
Nominal Hours: 50
Regardless of the mode of delivery, represent a guide to the relative teaching time and student effort required to successfully achieve a particular competency/module. This may include not only scheduled classes or workplace visits but also the amount of effort required to undertake, evaluate and complete all assessment requirements, including any non-classroom activities.
Pre-requisites and Co-requisites
This course covers, skills and knowledge required to design web environments.
National Codes, Titles, Elements and Performance Criteria
National Element Code & Title:
CUFDIG502A Design web environments
Element 1 Determine project requirements
1. Analyse project brief to identify purpose of, and target audience for, web environments
Element 2 Research and select web environments
2.1 Research web environments and analyse their potential
Element 3 Draft design specifications
3.1 Design the architecture of web environments to show
Element 4 Review design specifications
4.1 Review designs against required project outcomes, as
On successful completion of this unit, you will be able to apply your skills and knowledge to design web environments.
Details of Learning Activities
In class learning activities include, but are not limited to:
• class presentations
• group discussion
• online research
• independent project based work
• teacher directed group activities/projects
• workshopping of students’ own projects
Out of class activities include, but are not limited to:
• online research
• work shopping
• independent project based work
Using Dreamweaver, bootstrap - HTML & CSS Styles basics. Style library for bootstrap & ideas for 1 page folio. BG tutorial - css colours
|1||Course outline. Intro to responsive design. |
Assignments briefing - Web trends css and HTML5 & CSS3 Frameworks for responsive design. Screen Sizes.
Search for inspiration for one page portfolio website. Search for examples of successful responsive frameworks or templates
|2||An overview of responsive web design tools & limitations of responsive websites |
Firefox, firebug. Dreamweaver, HTML & CSS Styles basics. Sign into rams server.
Begin to Research – sketch layout ideas for your personal portfolio - look at bootstrap framework and site examples.
|Formative 1 - Basic Skills Assessment – Browser code analysis Firefox & firebug. In class||1, 2|
|3||Using Dreamweaver, bootstrap - HTML & CSS Styles basics. Style library for bootstrap & ideas for 1 page folio. BG tutorial - css colours||1, 2|
|4||Background Images. Adaptive images. Bootstrap. Bootstrap & frameworks for designers. Install Bootstrap. Web fonts||1, 2|
|5||Formative 2 - Browser based changing of code – CSS over-rides (HTML 5 + CSS3) – Bootstrap||Formative 2 - Basic Skills Assessment – Install bootstrap change page in Firefox & firebug. In class.||1, 2|
|6||Web fonts & – css design – illustrator template for responsive layout. Tutorial in Lynda
Typography on the web
|1, 2, 3|
|7||Summative 1 - wk 7 - Design Doc + Wireframe Personal Folio Website x 3 Presentations – feedback session|
Present photoshop or illustrator mockups to class to obtain feedback - 5 second design impact group work - is design effective?
|Summative 1 – design portfolio responsive layout in photoshop or illustrator.||1, 2, 3, 4|
|8||Menu tutorial - CSS & basic jquery page scrolling Bootstrap||1, 2, 3|
|9||Accessibility & media – HTML5 video and flash - Intro to Summative 2. Begin website coding||2, 3|
|10||Metadata, SEO Bootstrap configuration & upload|
– looking at CMS
|11||Gallery tutorial bootstrap|
|12||Slider tutorial bootstrap|
|13||Studio class – social networking integration||2, 3|
|14||Studio class – beta test website & Upload to server||1, 2, 3, 4|
|15||Summative 2 - Launch Personal Folio Website|
Cross browser/device testing and issues. Submit developed website & Upload to server
|Summative 2 – coded responsive website portfolio in html5 & CSS 3 using bootstrap||1, 2, 3, 4|
|16||Peer test and web page critique, troubleshooting & debugging.|
Submit developed website & Upload to server
Students are encouraged to make full use of University computer lab resources. Please consult the course
Blackboard page or the University web site for details of access times and locations.
Other required resources include broadband internet access, suitable digital media storage such as a portable hard drive or
USB flash drive, with at least 4Gb capacity.
Overview of Assessment
A variety of practical assessment tasks, to be submitted in class, will be used to establish competence in this course
Assessment tasks in this course are either formative or summative. Formative tasks provide the basis for ongoing feedback and can be considered as essential building blocks for the more substantial summative assessment tasks.
To demonstrate competency in this course, you will need to complete each one of the following pieces of assessment to a satisfactory standard. You will receive feedback on all assessments and a grade for the summative assessments.
Formative 1 - Basic Skills Assessment – Browser code analysis Firefox & firebug. In class. Due week 2.
Formative 2 - Basic Skills Assessment – Install bootstrap change page in Firefox & firebug. In class. Due in week 5.
Summative 1 – design portfolio responsive layout in photoshop or illustrator. Due week 7.
Summative 2 – coded responsive website portfolio in html5 & CSS 3 using bootstrap. Due week 15.
For further information on the grading system and criteria used, please refer to the course blackboard site.
Grades used in this unit are as follows:
Grades which apply to courses delivered in accordance with competency-based assessment, but which also use graded assessment:
CHD Competent with High Distinction
CDI Competent with Distinction
CC Competent with Credit
CAG Competent achieved graded.
DNS Did Not Submit for Assessment
NYC Not Yet competent.
The assessment matrix demonstrates alignment of assessment tasks with the relevant Unit of Competency. These are available through the course contact in Program administration
The major learning experience involves studio based exercises, demonstration and production. It is strongly advised that students attend all sessions in order to engage in the required learning activities, ensuring the maximum opportunity to gain the competency.
Cover Sheet for Submissions
You must complete a submission cover sheet for every piece of submitted work. This signed sheet acknowledges that you are aware of the plagiarism implications.
You will receive spoken and written feedback from teachers on your work. Where appropriate, this feedback will also include suggestions on how you can proceed to the next stage of developing your projects.
Student feedback at RMIT http://www.rmit.edu.au/browse;ID=9pp3ic9obks7
Monitoring academic progress is an important enabling and proactive strategy to assist you to achieve your learning potential. Student progress policy http://www.rmit.edu.au/browse;ID=vj2g89cve4uj1
Special consideration Policy (Late Submission)
All assessment tasks are required to be completed to a satisfactory level. If you are unable to complete any piece of assessment by the due date, you will need to apply for an extension. You can apply in writing for up to a week’s extension from your course teacher. If you need a longer extension, you wil need to apply for special consideration. Special consideration, appeals and discipline http://www.rmit.edu.au/browse;ID=qkssnx1c5r0y
Academic Integrity and Plagiarism:
RMIT University has a strict policy on plagiarism and academic integrity. Please refer to the website for more information on this policy go to Academic Integrity
It is a requirement of this program that all students participate in authentic work related tasks. These may be either simulated or in a real work environment. On occasion, we are approached by industry and given opportunities for students to apply for short term placements. When these placement opportunities arise, students are required to negotiate the specific details with the relevant program coordinator or teacher. All industry placements require students, RMIT staff and host organisations to sign a written agreement prior to the commencement of the placement.
Course Overview: Access Course Overview