The final will be delivered via SmartClass in the Interactive_Media_1/final folder during class. Make sure you have your files on hand.
Delivery instructions
Create a folder in the final/ folder titled lastname_firstname (your last and first name). Zip up your entire WordPress directory (right-click > Archive). Place it in your folder Export your WordPress database, place the .sql file [...]
Continued…Class this Wednesday will be held in Arts 194. We will be participating in a guest presentation by ShiftControl Studios. Attendance is mandatory. The event is open to all students. I anticipate it will be a very cool presentation, so feel free to bring a friend.
Event Details
What: Presentation by ShiftControl Studios When: 7:00pm-9:00pm Where: Arts 194 [...]
Continued…Installing WordPress
Read detailed instructions here, or follow along in class.
Installing Themes
Download the Learn theme for WordPress: go to http://github.com/gordonbrander/learn and click “Download Source” toward the top-right of the page.
Take the theme folder (learn/) and put it into your wp-content/themes/ directory.
About Themes
Learn is an ultra-simple theme for learning WordPress theming, with lots of comments throughout.
The simplest [...]
Continued…Follow along with the class tonight: Download hello-world.zip.
Using MAMP
MAMP is a Server-in-a-box. Basically, it turns your computer into a local web server. To use MAMP:
Launch MAMP. Start the Servers. Wait until the dots are green. Visit http://localhost:8888/ in your browser. This is your web root. It can only be viewed on your computer. Place PHP programs in Applications/MAMP/htdocs/.
Comic [...]
Continued…Developing a website is a complex endeavor, and it’s important to have a plan from the very beginning. One of the most important rules for developing a useful CSS system is this:
Create general styles first and specific styles last.
Styling your website is like creating a pyramid: create a good set of general styles as a [...]
Continued…Download buttons-stub.zip
Cool Button Techniques
Zurb makes cool buttons with CSS More cool (radioactive) buttons from Zurb Sliding-door CSS buttons One of the most useful techniques to learn. Sagmeister.com. This website is just wacky and cool.
Validate your code.
Continued…Keep your code clean and error-free: validators for HTML5. You can also validate your CSS.
Continued…Wireframing Ideas
Need some examples of wireframes? Check out the Wireframing Tumblelog. Jason Santa Maria shares his Grey Box Method of wireframing The future of wireframes update 2010-03-04 All the wireframing-related links you could ever want
Quote of the Day
I prefer drawing to talking. Drawing is faster, and leaves less room for lies.
— Le Corbusier
Continued…A couple people have asked about how wide they should make their website
The traditional maximum width for a website is 960px You can design for your audience using Google’s browser size tool. This gives average screen sizes for everyone that visits Google (hint: that’s nearly everyone).
Since the web is a scrolling medium, try thinking of wireframing [...]
Continued…Download the Menus Stub (.zip).
Class Notes
What is Affordance? Why is it important in Interaction design? How can you give your users affordances in your design?
Quote of the Day
Good design is thorough, down to the last detail. Nothing must be arbitrary or left to chance. Care and accuracy in the design process show respect [...]
Continued…Looking for online portfolios to analyze? Check out:
http://cargocollective.com/. Great work. I mean, crackerjack. http://www.rainbowmonkey.de/visual.html http://www.wk.com/ http://jasonzimdars.com/svn/ http://www.frankchimero.com/ … the list goes on…
Quote of the day
“Beware the lollypop of mediocrity: Lick it once, and you’ll suck forever.” — Brian Wilson
Box model exercise HTML
Box Model HTML/CSS Stub (.zip)
Portfolio Interaction Concepts
Site Title Site Description Site Navigation Portfolio Gallery
Thumbnail Title Description
Portfolio piece
Piece title Screenshot (larger) Individual gallery/slideshow Description (longer)
Lightboxes Close buttons [...]
Continued…To follow along with the recipe exercise, download recipe.html (.zip archive).
Update: Here is a copy of the Recipe Stub (.zip) for reference.
Continued…Hi all, I’m looking forward to meeting you on Wednesday the 20th. In the meantime, here are some resources for the class:
Class Syllabus
The syllabus and supporting documents have also been posted to BlackBoard. The list of required books can be found toward the bottom of the syllabus. The campus bookstore will not be stocking these, but you [...]
Continued…