Week 6

4 Comments

Session 1: Today we will continue looking at CSS3 transitions. In addition we will discuss the requirements for the next exercise: jQuery Gallery. jQuery is a JavaScript library or framework that makes complicated tasks easier to create. It is often used to enhance the UX of web applications by providing advanced user interface tools including accordions, tooltips, easing, menu systems, ajax, and more.

More on CSS3 Transitions:
Transitions and Animations
Easing Functions Cheat Sheet

jQuery is a cross-platform JavaScript library designed to simplify the client-side scripting of HTML. Used by over 60% of the 10,000 most visited websites, jQuery is the most popular JavaScript library in use today. jQuery is free, open source software, licensed under the MIT License. –Wikipedia

Exercise 2: jQuery Gallery
Due: Session 2, Week 7 (5 points)

Description:
Use one of the many examples of jQuery images viewers to create a gallery of nine images. Build the application into a single page that includes a 3 x 3 grid of thumbnails used as interface items for exploring the gallery. Prepare the environment so that it will work with or without internet access. A zip file of the environment that includes all the necessary web files (images, JavaScript files, html files, etc.) must be uploaded by session 2 of week 7.

Requirements:
1. Build a single page with a 3 x 3 grid of thumbnail images.
2. Implement a jQuery image viewer so that each images enlarges on clicking the thumbnail.
3. Set up the images in a gallery so that navigation to the previous and next images is available.
4. Upload to your student webspace by session 2 of Week 7.

Points Breakdown:
3 points will be awarded for properly implementing a jQuery gallery plugin.
2 points will be awarded for creating an effective thumbnail interface.

Relevant Resources:
LightBox
Fancybox
Flexslider
An article with many jQuery Gallery Plugins

Session 2: Today we will be presenting the CSS3 Transitions Exercise. Following the presentations we will continue demonstrating how to implement jQuery gallery plugins.

4 thoughts on “Week 6”

  3. Welcome to week 6 GoogleFu!

    1. http://www.techrepublic.com/article/fun-and-inspiring-css-examples-and-animation-effects/

    -In this article written by Ryan Boudreaux, he explores the new CSS animation models such as the solar system demo, and the CSS cake demo. These demos help demonstrate the the growth and cutting-edge web applications available through CSS. The article also explores a comprehensive CSS vocabulary guide, providing fantastic examples to assist anyone in learning CSS.

    2. http://www.poynter.org/news/media-innovation/323975/alex-duner-has-written-a-dozen-interactive-news-apps-up-next-graduating-college/

    -Here author Melody Kramer interviews Alex Duner, a sophomore college student at Northwestern University. In the article Melody explores how Alex became interested in programming, and how he has taken this interest and talent to write multiple applications which have helped improve the lives of those in the Chicago area. Most of Alex’s work has been made public on Github.com, and can be found at the following link. https://github.com/northbynorthwestern/.

    3. http://www.fastcoexist.com/3044051/these-mesmerizing-animations-tell-the-story-of-30-endangered-species#5

    -Written by Adele Peters, this article explore the interactive exhibit created in CSS by Bryan James. Bryan is a U.K. based designer who built this exhibit in order to experiment with coding CSS polygons. Once work began, he shortly realized he could use the shapes as puzzle pieces to represent a meaningful metaphor. The exhibit explores 30 endangered species, it goes on to explain why the species is endangered and charts the current population. You can visit the interactive exhibit by following the link, http://species-in-pieces.com/#.

    Hope you’ve enjoyed this weeks GoogleFu!

    Thanks,
    Jens

Comments are closed.