Network Media 1

Class Overview

This course introduced students to the World Wide Web as a medium. Originating from efforts to create a standardized information-retrieval system, the WWW developed into a broadcast media, a shopping mall, a communication platform, and an environment for personal expression. Although this class offered a wide range of workshops dealing with web technologies, it focused on conceptual and aesthetic aspects of designing for the web. Creative projects and exercises were developed throughout the course by utilizing the various skills acquired in class in the service of perception and communication.

Web technologies are constantly and rapidly changing. By focusing on the concepts behind those technologies, the acquired skills working with XHTML, CSS, and Javascript will be transferable to future contexts. The course wished to develop the vocabulary necessary to speak to developers, to present and discuss Web projects, and to pursue individual research. During the quarter students had the opportunity to complete a series of exercises, analyze and discuss Web projects, and present a research report.

Info
Year: Fall 2009
Course: DMA 161A Creative Internet - Network Media (4 units)
Location: Design | Media Arts, University of California, Los Angeles

Tools: HTML, CSS, Adobe Creative Suites

Instructor: Chandler Mcwilliams
Teaching Assistant:Yoon Chung Han

Course website:
http://classes.dma.ucla.edu/Fall09/161A/






Pedagogy 1: Create their own stories before desiging
Since the final outcome from this class was students' own personal website in their unique style, they required to have their own stories, concepts and approaches to express themselves. Students required to submit a PDF file that contained ideas, inspriations and visual concepts they wanted to approach to their websites. The fundamental thought processs allowed them to brainstorm their ideas, research possibilities, and simulate how it would look.




Student: Alyssa Anduiza


Pedagogy 2: Wireframes and sitemap
Space organization and construction of visual elements is the most important part in web design. Students were asked to design wireframes in grayscale to organize the various size of contents on the screen. Before adding colors or images/video on the website, the grayscale wireframes helped plan ahead users' interaction in clear and intuitive way. In order to help students understand the importance of the wireframe, I intruduced them the space layout in graphic / editorial design, and encouraged to play diverse design layout as much as possible. Also, students created sitemap that organized hierarchy of information so that students could decided the main, sub menu and contents under those menues.






Pedagogy 3: Self expression and consistency on their own websites
When they were ready to move on designing website with actual informtion, images and video, I emphasized the "consistency" to show their style and concept well. Every pages on their website should have consistent rules so that users can read and understand the information well without confusion or inconvenience. Some students created each web pages in each different layout to focus on the graphic elements only. Each page was designed well but in big picture the website was not unified to show the student's intention. I suggested to add consistent layout and style of menu, and eventually it looked better than before. Every student changed the style of class website built in wordpress by modifying CSS, and every students suggested all different concepts and appraoches, which were fun to see at the end.










Please visit class website to see more details and more students' works.





UCSB MAT 259
Algorithmic Visualization (Processing)
UCLA Summer Institute
Web Design (HTML, CSS)
UCLA DMA 161A
Creative Internet (HTML, CSS)
UCLA DMA 161B
Dynamic Internet (HTML, CSS, PHP)
UCLA DMA 24
Motion (After effect)