Difference between revisions of "Courses/Design & Technique-Essential Web Design"

From Publication Station
 
(40 intermediate revisions by 2 users not shown)
Line 1: Line 1:
[https://mywdka.nl/15kw1go/onderwijsenlesaanbod/theme_contents_assignments/dropping-me-world/ Course planning inside MyWdKA]


[[Courses/Design & Technique-Essential Web Design/Q1|'''Pages from Design & Technique during Quarter 1 2015''']]
==[[Courses/Design & Technique-Essential Web Design/Q1|''' Design & Technique - Part 1 ''']]==
* [[Courses/Design & Technique-Essential Web Design/01|The Internet and the Web]]
* [[Courses/Design & Technique-Essential Web Design/02|HTML: structure, tags]]
* [[Courses/Design & Technique-Essential Web Design/03|CSS: rules]]
* [[Courses/Design & Technique-Essential Web Design/04|CSS selectors, position, and display]]
* [[Courses/Design & Technique-Essential Web Design/05|CSS: typography]]
* [http://codepen.io/PublicationStation/pens/public/ Publication Station @ Codepen]: examples
* [[Wdka_ftp|Upload files to WdKA FTP]]


__NOTOC__
==[[Courses/Design & Technique-Essential Web Design/Q2|Design & Technique - Part 2]]==


=Quarter 2 2015=
* class 1 [[Courses/Design_%26_Technique-Essential_Web_Design/Q2/01 | Vector Graphics on the web]]
== Your city in the browser ==
* class 2 [[Courses/Design_%26_Technique-Essential_Web_Design/Q2/06 | audio and video]]
In the second quarter of Design & Technique will be focus on presenting the '''''behind the scenes'' of your intervention and research on a square from the city of Rotterdam''', through the web, to the the world. In other words, you will ''record'' fragments of your intervention – the images, sounds, history, reactions, thoughts and dreams about this square – and explore ways to present them online, so that the user gains a sense of the place and of your intervention.
* class 3 [[Courses/Design_%26_Technique-Essential_Web_Design/Q2/02 | JavaScript]]
* class 4 [[Courses/Design_%26_Technique-Essential_Web_Design/Q2/03 | jQuery]]
* class 5 [[Webcam_html | using the Webcam in the browser]] , [https://mywdka.nl/16VGWPNV12GV/#post-221 groups and intervention], [http://codepen.io/PublicationStation/pen/zoELXw jquery]
* [[Panorama on web pages]]
* [[Browser_motion]]
* [http://localhost/D_T/story/ collective story]
* Building a [[Chrome extension]]


Building on the knowledge and experience acquired in quarter one, you will be encourage to create interactive works. Outcomes can take any form, from animated drawings, interactive maps, generative image, audio-visual works, or data visualizations.


=== Subjects  ===
http://publicationstation.wdka.hro.nl/go/kickoff/imgs/Construction.gif http://publicationstation.wdka.hro.nl/go/kickoff/imgs/Construction.gif http://publicationstation.wdka.hro.nl/go/kickoff/imgs/Construction.gif
Subjects explored include:
* Scalable Vector Graphics (SVG) – for the creation of interactive and animated vector images in the browser, also in conjunction with vector drawing software, such as Illustrator and Inkscape.
* JavaScript and jQuery - to provide the interactive and dynamic elements to web pages to pages
* [http://snapsvg.io Snap.svg] Javascript libraries - for ''SVG manipulation''.
* [http://d3js.org/ D3] Javascript library - for the ''creation of visualizations''
* HTML audio-video and canvas


=== Work load ===
=Past courses=
The work load for the quarter will be divided into:
* [http://publicationstation.wdka.hro.nl/go-student/ Students' work - Quarter1 2015/2016]
* '''weekly classes''',
* '''simple weekly deliverables''' – small exercises that consolidate the techniques and concepts approached in classes, as well as allow you to find expressive and personal ways of employing them.
* '''one main deliverable project -''' that will congregate the knowledge acquired from classes and deliverables onto a project where you create the ''behind the scenes'' of your intervention.


[https://mywdka.nl/15kw1go/onderwijsenlesaanbod/theme_contents_assignments/dropping-me-world/ Course planning inside MyWdKA]


[[File:js-woody-buzz.jpg]]
__NOTOC__
 
== Classes==
* [[Courses/Design_%26_Technique-Essential_Web_Design/Q2/01]]
* [[Courses/Design_%26_Technique-Essential_Web_Design/Q2/02]] - JS
* [[Courses/Design_%26_Technique-Essential_Web_Design/Q2/03]] - jQuery
* [[Courses/Design_%26_Technique-Essential_Web_Design/Q2/04]] - exploring the city - choose your own adventure game
* [[Courses/Design_%26_Technique-Essential_Web_Design/Q2/05]] - review game; tutorials
* [[Courses/Design_%26_Technique-Essential_Web_Design/Q2/06]] - audio and video
* [[Courses/Design_%26_Technique-Essential_Web_Design/Q2/07]] - (D3 visualizations)
* [[Courses/Design_%26_Technique-Essential_Web_Design/Q2/08]]
 
==Examples==
* [[Courses/Design_%26_Technique-Essential_Web_Design/Q2/Example/Business-card]] - constantly change image
* [[Courses/Design_%26_Technique-Essential_Web_Design/Q2/Example/Form]] - user text input
 
== Web-based works that explore city spaces ==
* [http://www.exhaustingacrowd.com/ Exhausting a Crowd by Ky McDonald]
* [http://lust.nl/#projects-3478 Urban Echo] by LUSTlab
* [http://aporee.org/maps/ Radio Aporee]
* [[Courses/Design_%26_Technique-Essential_Web_Design/works/Collective Waiting Portrait|Collective Waiting Portrait]]
* '''Janet Cardiff'''
** ''Ghost Machine'' {{youtube|Tgef5gel4sk}}
** ''Alter Bahnhof Video Walk'' {{youtube|sOkQE7m31Pw}}

Latest revision as of 09:31, 24 October 2017

Design & Technique - Part 1

Design & Technique - Part 2


http://publicationstation.wdka.hro.nl/go/kickoff/imgs/Construction.gif http://publicationstation.wdka.hro.nl/go/kickoff/imgs/Construction.gif http://publicationstation.wdka.hro.nl/go/kickoff/imgs/Construction.gif

Past courses

Course planning inside MyWdKA


Retrieved from ‘https://ps.wdka.nl/wiki/index.php?title=Courses/Design_%26_Technique-Essential_Web_Design&oldid=6756’