Week 5: Online tools and resources
Week 5 Practical Application and Helpful Apps. We will cover creating your own content, free design tools on the web, and resources. There will be a short series of assigned graphic creation and design tasks, a little HTML and maybe a bit of CSS. Final project work can begin this week if desired, and can be included in critiques.
No presentation. We may instead do live critiques of each others' work. Extra office hours. Thursday March 10th and Friday March 11th 8:15 -10:15 am PST (GMT-8) and 6:30 - 8:30 pm PST (GMT-8)
This week is pretty much all practical work.
Final Assignment due END OF WEEK 6 between Monday March 21 and Wednesday March 23: This week, we get to play with online apps. Use the resources linked below and what you have learned over the past several weeks to flesh out your wireframes or start an entirely new project. The final will need to be hosted somewhere (advanced featcures can still be placeholders). Customizing a blogging tool is also acceptable, since what we are learning here is how to make usable designs. You do not have to "turn in" the site this week, it is due between Monday March 21 and Wednesday March 23.
This weeks smaller assignments (due Wednesday March 16th):
This week is pretty much all practical work.
Final Assignment due END OF WEEK 6 between Monday March 21 and Wednesday March 23: This week, we get to play with online apps. Use the resources linked below and what you have learned over the past several weeks to flesh out your wireframes or start an entirely new project. The final will need to be hosted somewhere (advanced featcures can still be placeholders). Customizing a blogging tool is also acceptable, since what we are learning here is how to make usable designs. You do not have to "turn in" the site this week, it is due between Monday March 21 and Wednesday March 23.
This weeks smaller assignments (due Wednesday March 16th):
- Use tools to create original content for your project. Examples include diagrams, logos, design elements, videos, etc.
- Experiment with coding methods to see what works best to make your wireframe a real site.
- Try as many tools as you can find time for/have use for/interest in, and give feedback on the ones you like and do not like.
Graphics, video, sound tools:
- http://mugtug.com/sketchpad/
- http://www.aviary.com/ <suite of online tools
- http://mrdoob.com/projects/harmony/
- http://www.divvr.com/
- http://cloud-canvas.com/
- http://pixlr.com/
- http://antimatter15.com/wp/ajax-animator/ <animation editor with built in vector graphics editor
- http://280slides.com/ <presentations
- http://www.audiotool.com/ <audio
- http://www.stupeflix.com/ <video
- http://www.screencast-o-matic.com/ <screencast recording and upload to Youtube
- http://shiftedit.net/ <free, online code editor, compatible with DropBox
- http://paste.bradleygill.com/ <code sharing tool
- http://www.w3schools.com/ < online tutorials for learning or looking up essential code basics
- http://www.smashingapps.com/2011/02/28/six-useful-google-code-labs-products-for-people-who-develop-websites.html
- http://www.lumzy.com/index.cfm <prototyping, with image editing and collaboration
- http://www.mocklinkr.com/ <mockup sharing
- https://www.lucidchart.com/ < free for 2 person collaboration
- https://www.gravitydev.com/ < project management
- https://www.dropbox.com/ < content sharing and collaboration
- http://www.techsmith.com/jing/ <screencasting
- http://freedcamp.com/ <project management suite
- https://convore.com/ <instant messaging with a defined group
Other resources:
- http://patterntap.com/ <ui design reference
- http://ui-patterns.com/ <ui design reference
- http://www.freefoto.com/index.jsp <free-use photo library
- http://snappages.com free for personal use, very flexible wysiwyg style web site maker (tour here http://snappages.com/tour)
- http://www.pagefin.com Another page editor. Not as flexible.