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

From Publication Station
Line 46: Line 46:
* work-session  
* work-session  
* work-session
* work-session
==Study resources==
==JavaScript & jQuery==
* [https://www.codecademy.com/learn/javascript codecademy javascript]
* [https://www.codecademy.com/learn/jquery codecademy jquery]
* [https://www.lynda.com/jQuery-tutorials/jQuery-Essential-Training Lynda jQuery-Essential-Training]
* [https://www.lynda.com/jQuery-tutorials/jQuery-Web-Designers jQuery-Web-Designers]
Library books
* [https://vubissmart.hro.nl/webopac/FullBB.csp?WebAction=ShowFullBB&EncodedRequest=*AA*C3*A46*D9*83*F2*A5*AB*F4*12*15*EB*10*11y&Profile=Default&OpacLanguage=dut&NumberToRetrieve=50&StartValue=1&WebPageNr=1&SearchTerm1=2014.2.219701&SearchT1=&Index1=Index1&SearchMethod=Find_1&ItemNr=1  Learning jQuery 1.3 : better interaction design and web development with simple Javascript techniques]
* [https://vubissmart.hro.nl/webopac/FullBB.csp?WebAction=ShowFullBB&EncodedRequest=*AA*C3*A46*D9*83*F2*A5*AB*F4*12*15*EB*10*11y&Profile=Default&OpacLanguage=dut&NumberToRetrieve=50&StartValue=7&WebPageNr=1&SearchTerm1=2010.2.205400&SearchT1=&Index1=Index1&SearchMethod=Find_1&ItemNr=7 jQuery in action]
* [https://vubissmart.hro.nl/webopac/FullBB.csp?WebAction=ShowFullBB&EncodedRequest=*AA*C3*A46*D9*83*F2*A5*AB*F4*12*15*EB*10*11y&Profile=Default&OpacLanguage=dut&NumberToRetrieve=50&StartValue=1&WebPageNr=1&SearchTerm1=2014.2.219701&SearchT1=&Index1=Index1&SearchMethod=Find_1&ItemNr=1 JavaScript & JQuery : Interactive Front-end Web Development]




Revision as of 17:21, 29 November 2016


Js-woody-buzz.jpg

Quarter 2 2015

Your city in the browser

In the second quarter of Design & Technique will be focus on the interactive side of web design.

As an assignment you'll be asked to build a tool or interface for your intervention, using web design tools.

Tools and interfaces can take the shape of a map, a game, a audio guide, a video, an animated illustration or anything else you come up with, which changes the perception or functioning of a place, in this case the location of your intervention.

For example of works that change a location, through an interface, see the art works bellow

Web-based works - exploring city spaces


Topics:

  • interaction with audio and video
  • vectorial drawings: that can react to the user actions in the browser
  • Javascript and jQuery: to interaction with elements of you page.
  • capture web cam
  • geolocation


deliverables

The work load for the quarter will be divided into:

  • 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.
  • final deliverable - a tool or interface for your intervention

Classes


Study resources

JavaScript & jQuery

Library books


Examples

Brain storm

Subjects

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
  • Snap.svg Javascript libraries - for SVG manipulation.
  • D3 Javascript library - for the creation of visualizations
  • HTML audio-video and canvas
Retrieved from ‘https://ps.wdka.nl/wiki/index.php?title=Courses/Design_%26_Technique-Essential_Web_Design/Q2&oldid=5837’