| SANTIAGO ECHEVERRY ART311 | On-Line Production | SPRING 2012 | PRE-REQ: ART210 Section H | T - Tr | 2:00PM - 4:20 PM | CAS 134 secheverry at ut.edu | CAS Annex 112 | 813 - 813 257 3769 | Office hours by appointment only |
|||||
| Week | Description | Assignments | |||
| 1 - INTRO |
TEXT as the base for all Internet creation. SSH, SFTP, FUGU, Fetch, FTP. Basic XHTML, structure, theory, open source. CSS. How to set up your server space. Explore: http://www.asciimation.co.nz/ http://www.chris.com/ascii http://webmonkey.wired.com/webmonkey/ |
Readings: History of the Internet, Internet for Historians Personal computer milestones http://www.w3schools.com • Purchase your own domain name and server space. Send me an email before our next class with the link to your site. This is ESSENTIAL for this class. • Digital ASCII art: each student has to present 3 pieces of digital ASCII art, both printed and on their website. glassgiant.com / |
|||
| 2 - XHTML |
More Basic XHTML, definitions, syntax, examples, text coding, browser particularities. CSS: Fonts, sizes, colors. Images. Opacity jimwestergren.com/worst-web-design-ever webpagesthatsuck.com |
Using strict XHTML+CSS, transform your original digital ascii creations into interactive css creations, or if you prefer, you can create at least 3 new ascii projects Styling web content with CSS3 caniuse.com ELASTIC layout http://www.csszengarden.com/ |
|||
| 3 - XHTML |
Advanced XHTML: display of information, CSS, font control Divisions, tables, images, transparent gifs, absolute and relative positioning GOOGLE FONTS |
Visual Poem Project: transform your favorite poem/text ( at least 20 lines ) into a visual html project, using basic CSS, images, tables, fonts, colors. You will create two versions 1) using tables and 2) using only divisions and CSS positioning | |||
| 4 - HTML5 |
Advanced HTML: Iframes/frames. Advantages and disadvantages. HTML 5 Canvas: video and audio DIS MAGAZINE HTML in Dreamweaver / HTML 5 Video Explore: Canvas + HTML5 Animation |
Using HTML 5 and any editor of your choice, create your own extended family tree, using iframes, images, sounds, animations. You will show all the relations between the different members of your extended family. Embed at least one applet ( dcr, swf, mov... ) Due in 2 weeks | |||
| 5 - JAVASCRIPT |
FORMS: different elements, |
• Create at least 3 dhtml documents that will explore the possibilties of Dynamic HTML, rollovers, motion, alteration of content, resizing, randomness, etc... - Open topic. HAVE FUN! • Form ART: in the same way you created the ASCII art, explore the possibilities of creating visual animated experiments using form elements and the refresh metatag. |
|||
| 6 - JQUERY |
Client side programming for the web. JQuery + JQueryUI / LATEST LINKS. Form verification, notions of variables, functions, usage, examples: random images, time and date jquery.com Explore: http://devguru.com/home.asp |
Explore: webmonkey.com/2010/02/get_started_with_jquery/ no-margin-for-errors.com JS CSS DOM Practice 1 GREAT: http://learn.appendto.com/ comptechdoc.org javatag.com |
|||
| 7 - JQUERY |
DHTML having fun with visual properties |
create an interactive story where the user will be able to change the parameters of the narration in the form of a MadLib. The story must have at least 5 versions, and minimum 10 parameters. Use form verifications and dynamically placed images. |
|||
| 8 - JQUERY |
JQUERY applications. animated menu, slide show, slimbox2, prettyPhoto, slide menus , EVENTS, |
||||
| 9 - SERVER SIDE |
Server side programming. PHP Syntax and examples | Create your PHP email form ( with form verifications and security questions) Explore: www.php.net www.dynamicdrive.com |
|||
| 10 - SERVER SIDE |
Server side programming. PHP Syntax and examples. Functions, reserved variables, user information, Includes. | design the first draft of your website using PHP includes. Due in 2 weeks |
|||
| 11 - SERVER SIDE |
PHP Syntax and more examples isset - random - |
Explore: www.phpclasses.org |
|||
| 12 - WORDPRESS |
Understanding WORDPRESS codex.wordpress.org/WordPress_Lessons |
Create a subdomain exclusively for your WORDPRESS site. Set up your admin account and explore the possibilities. |
|||
| 13 - WORDPRESS |
Being an Admin in Wordpress Widgets |
Customize your Wordpress site, change the templates, add widgets and apps. | |||
| 14 - WORDPRESS |
PORTFOLIO SITE |
Create your own portfolio site using Wordpress. Use all the bells and whistles, but make sure it is 1) NOT CHEESY, 2) NOT BLOGGY, 3) TOTALLY PERSONAL (colors, fonts, images, logos) and extremely well designed. | |||
| 15 - MOBILITY |
Final project workshop phonegap.com JQUERY Mobile Dreamweaver Mobile Applications 40 Ipad Design tips NB Stanford iOS: http://itunes.apple.com/itunes-u/iphone-application-development/id384233225 |
||||
| 16 - FINALS |
FINAL PROJECTS - EVERYONE MUST BE PRESENT THURSDAY MAY 3RD / 1.30 - 3.30 PM exams |
||||