Creating a Video Sitemap - Webmaster Tools Help

Creating a Video Sitemap - Webmaster Tools Help

ActionScript FontControl class – external font library

FontControl class – external font library

How To: Transform MRSS feeds to Google video sitemaps

How To: Transform MRSS feeds to Google video sitemaps

Mosaic - Sliding Boxes and Captions jQuery Plugin

Mosaic - Sliding Boxes and Captions jQuery Plugin

Here's a nice plugin JQuery Library to consider. I won't be teaching Web Tech this summer semester... i need a summer break this year! but as promised, i'll keep offering tips and tools for all.

Classes start June 30th! Good luck to all, especially the recent grads!

Communication Arts Competitions

Communication Arts Competitions: "For designers creating posters, brochures, packaging, trademarks, corporate identity, integrated branding, annual reports, catalogs, public service, self-promotion, letterheads and signage. Juried by nine top designers, the best design of the last year rises to the top."

Wallaby | Adobe Flash FLA to HTML - Adobe Labs

Today I fielded some questions on how to create interactivity for the iPad 2 with animated books... using flash animations and maya graphics.... this is one approach...

"Wallaby" is the codename for an experimental technology that converts the artwork and animation contained in Adobe® Flash® Professional (FLA) files into HTML. This allows you to reuse and extend the reach of your content to devices that do not support the Flash runtimes. Once these files are converted to HTML, you can edit them with an HTML editing tool, such as Adobe Dreamweaver®, or by hand if desired. You can view the output in one of the supported browsers or on an iOS device.

Wallaby | Adobe Flash FLA to HTML - Adobe Labs

Typekit

Typekit: Add a line of code to your pages and choose from hundreds of fonts. Simple, bulletproof, standards compliant, accessible, and totally legal.

25 HTML5 Video Resources You Might Have Missed - Streaming Media Magazine

25 HTML5 Video Resources You Might Have Missed - Streaming Media Magazine

i'm a fan of h.264 but... Google's Rejection of H.264 in Chrome Means a Unified HTML5 Video Tag is Now a Pipe Dream

Google's attempt to clarify its decision to drop H.264 from Chrome in favor of WebM creates even more questions than it answers

Beanstalk — Secure, Private Subversion and Git Hosting | Feature Tour

Beanstalk — Secure, Private Subversion and Git Hosting | Feature Tour

Beanstalk has earned a reputation for bringing ease to managing, collaborating, and deploying code. That pursuit of simplicity is difficult with complicated concepts like version control, but we’re pleased to hear from our customers regularly about how much easier we make their days.

Colors In Corporate Branding And Design - Smashing Magazine

Colors In Corporate Branding And Design - Smashing Magazine

Though a lot of my experience is working with large corporate companies, this is a helpful consideration for design...

The average Web designer works mostly on websites for small- to medium-sized businesses and will likely never work for companies of this size and magnitude. However, there are still some lessons that can be applied to websites of smaller companies that don’t have an established brand recognized around the world...

Multilingual Subtitling Using BEML & External Subtitle Files

Multilingual Subtitling Using BEML & External Subtitle Files

Link Shell Extension

Link Shell Extension

good to know, use to keep things current

jQuery vs MooTools: Choosing Between Two Great JavaScript Frameworks

jQuery vs MooTools: Choosing Between Two Great JavaScript Frameworks

JavaScript: What is better jQuery, MooTools or Prototype? - Quora

JavaScript: What is better jQuery, MooTools or Prototype? - Quora

How could YUI3 improve its image compared to jQuery, MooTools, etc.? - Quora

How could YUI3 improve its image compared to jQuery, MooTools, etc.? - Quora

Using jQuery with Other Libraries - jQuery JavaScript Library

Using jQuery with Other Libraries - jQuery JavaScript Library

If you include jQuery before other libraries, you may use "jQuery" when you do some work with jQuery, and the "$" is also the shortcut for the other library. There is no need for overriding the $-function by calling "jQuery.noConflict()".

W3C HTML5 Logo

W3C HTML5 Logo: "magination, meet implementation. HTML5 is the cornerstone of the W3C's open web platform; a framework designed to support innovation and foster the full potential the web has to offer. Heralding this revolutionary collection of tools and standards, the HTML5 identity system provides the visual vocabulary to clearly classify and communicate our collective efforts."

Summer - The HTML5 Library for Java

Summer introduces a super clean dynamic HTML5 markup that enables templates, expressions and iterators. In order to enable these it internally utilizes a subset of the functionality offered by JavaServer Faces 2.0 while preserving the overall Spring MVC ideology. Summer takes advantage of the modular capabilities of Servlet 3.0 and enables the creation of true web enabled modules that combine both Java code, configurations and static resources. Thanks to Spring 3 you can easily apply conversion and bean validation as well as data binding, content negotiation and REST support. The project also offers an optional integration with jQuery which enables partial page rendering using AJAX and HTML5 WebSocket capabilities based on the Atmosphere framework.

Summer is still in a young project and doesn't offer much documentation. It's available on GitHub and we're open for people who find it interesting and want to contribute whatever they can. Our plans for the next milestone include features like Flash scope and AJAX validation as well as some more samples.

MoMA, The Museum of Modern Art : Art Project, powered by Google

MoMA, The Museum of Modern Art : Art Project, powered by Google

Just because the SF MOMA is literally behind 180NM, doesn't mean you can't pop inside an art museum anytime you want, thanks to google!

I can see people walking in the SF MOMA from my office... but this brings things to a new level!

The resolution is incredible - you can see the craquelure in Starry Night !

IT'S ALL ABOUT YOU

90TH ADC Awards | Eligibility:

DEADLINES
January 21st 2011 - Design, Photography, Illustration and Design Sphere
January 28th, 2011 - Interactive
January 28th, 2011 - All Student Deadlines
February 6th, 2011 - Advertising and Hybrid

PROFESSIONALS
All entries, excluding those in the Playground and Design Sphere categories, must have been printed, published, aired, or broadcast live online for the first time between February 8, 2010 and February 6, 2011, in any country. Entries may be submitted by any company or individual involved in the creation or production of the work.
Note: A winning entry is not guaranteed in every category.

STUDENTS
Students currently enrolled in undergraduate, graduate, and continuing education programs in advertising, graphic design, photography, illustration, and new media are eligible for the competition, and are invited to submit published or unpublished work in any category except the Hybrid, Design Sphere and Playground categories.

Student work will be judged separately but by the same criteria and juries as professional work. All student winners will be included in the Art Directors Annual 90. Higher award winners (Gold, Silver, and Bronze) will be included in the New York and traveling exhibitions and in related advertising and promotional materials."

jQuery plugin for radical web typography.

Web type is exploding all over the web but CSS currently doesn't offer complete down-to-the-letter control. So we created a jQuery plugin to give you that control. Here are a few examples of what can easily be done with Lettering.js:

Kerning Type

Editorial Design

Manageable Code

Complete Control

Lettering.js - A jQuery plugin for radical web typography.

student course work: The Final Countdown...

aly fayollat's course work page

dave hall's course work page

adrian osman's coursework


bryan harris


the site's links are all to her hard drive... too bad (unless you want to hack into her hd).
jennifer orlando's course work page

sorry for the rest of the class, i haven't had an opportunity to upload everyone's links.  some were VERY late... which is why grades were very last minute...

Portfolio Projects...
a great start:

aly fayollat

a red 4Leaf clover:
swf object undefined... long wait time for video on the home page. way too big for what it is... missing up button (404ing)
http://www.mikekeogh.com/


bryan harris

Thomas Smet 


lindsey avery

jennifer orlando's website

end of the semester is upon us...

it's never too late to master something you truly want to learn, regardless of a timeline put forth on you here, if it takes you longer to learn, sobeit. don't be discouraged, this is abstract stuff. but once you get it, it gets easier. usually. so that means you'll get faster. eventually.

Here's the school's policy on Incompletes.
Please refer all student requests for an Incomplete to online@academyart.edu.

Academy of Art University Incomplete Policy

In special circumstances, a student may petition for a grade of Incomplete (I). Students must send a request before the end of the term (Saturday, December 18, 2010) to online@academyart.edu. Authorization for an Incomplete is NOT automatic and approval will depend on the circumstances leading to the request. Students will generally be required to provide documentation verifying that they are unable to complete the required final class assignment because of a personal emergency, an illness, or a documented family emergency. All other work must be completed and up-to-date with only the final project or final exam not completed.

Supersized - Full Screen Background/Slideshow jQuery Plugin

Supersized - Full Screen Background/Slideshow jQuery Plugin

Lots of questions on jQuery... here's a plugin Lindsey VG is using...

So, what exactly does Supersized do?

* Resizes images to fill browser while maintaining image dimension ratio
* Cycles Images/backgrounds via slideshow with transitions and preloading
* Navigation controls allow for pause/play and forward/back

Image Gallery Navigation

some great examples from this assignment:

"Find an image gallery that uses thumbnail navigation that you think is particularly effective. The gallery doesn't necessarily need to load just images. It can also load videos, animations, interactive elements, sound -- all kinds of media.

Write a paragraph about why you chose this particular gallery and why you believe it is particularly effective. Talk about the over all design, the way the thumbnails are cut, the proportions of the thumbnails to the enlargements and how the page is arranged. Also, talk about the interactivity. Is is interesting interactivity? Why?"

Bergdorf Goodman - World-renowned fashion, plus exclusive beauty brands

HENRIK KAM PHOTOGRAPHY - SAN FRANCISCO - ARCHITECTURE/LANDSCAPE/PEOPLE

Dribbble - What are you working on?

TheFWA

YUI 2: Index of Library Examples

YUI 2: Index of Library Examples: "YUI 2: Index of Official Examples

Every YUI Library component ships with a series of 342 examples that illustrate its implementation. These examples can serve as starting points for your exploration of YUI, as code snippets to get you started in your own programming, or simply as an inspiration as to how various interaction patterns can be enabled in the web browser via YUI.

The navigation controls on the left side of this page allow you to explore these examples component-by-component; on this page you'll find the full index of library examples with a link to and short description of each one."

YUI 3 — Yahoo! User Interface Library

YUI 3 — Yahoo! User Interface Library: "YUI 3 is Yahoo!'s next-generation JavaScript and CSS library. It powers the new Yahoo! homepage and incorporates what we've learned in five years of dedicated library development. As of the 3.1.1 release, the YUI 3 Library has grown to include the core components, a full suite of utilities, the Widget Infrastructure, and a few Widgets. All YUI projects are BSD-licensed and are available for forking and contribution on GitHub."

jQuery UI Slider - Default functionality

jQuery UI Slider - Default functionality

jQuery UI provides a comprehensive set of core interaction plugins, UI widgets and visual effects that use a jQuery-style, event-driven architecture and a focus on web standards, accessiblity, flexible styling, and user-friendly design. All plugins are tested for compatibility in IE 6.0+, Firefox 3+, Safari 3.1+, Opera 9.6+, and Google Chrome.

samples of class work

Fancy Buttons Assignment: Designing Women from Elle Decor

Recipe from my friends by Alvin Wong (innovative presentation)

harry potter : Three-column layout

Alyson Fayollat | course portfolio

inspiration, insight and style

Several people are asking about Fireworks help...
Let this be another helpful resource... (a collection of fireworks sites that provide insight on the tool)
http://www.noupe.com/how-tos/the-ultimate-adobe-fireworks-toolbox.html


How the Swiss Style Relates to the Web
This style of graphic design was born in the institutional context. The majority of work from this movement are in the form of posters, stamps, institutional typographical identity, street signs, etc. In this sense, these artists are leveraging much more than just top-down communication, they’re creating user-friendly interfaces.

As a result of that, Swiss Style artists tend to put their artistic efforts in that the content they are conveying delivers its intended message in a clear, unobtrusive fashion. One can make the point that they were thinking, in a broader sense, about usability long before the web even existed. How can we not learn from these great masters?

Have you seen/rented Helvetica?  interesting film.

http://www.smashingmagazine.com/2009/07/17/lessons-from-swiss-style-graphic-design/

Fillerati - Faux Latin is a Dead Language

Fillerati - Faux Latin is a Dead Language

Are you tired of reading “Lorem ipsum…” in every new design on which you work? Use Fillerati instead.

Colors In Corporate Branding And Design - Smashing Magazine

Colors In Corporate Branding And Design - Smashing Magazine:

I have been in discussion with many on your color choices and issues with it... take a look at this article...

"Color is a major consideration in any Web design. Whether for an individual, small company, or major corporation, color scheme is one of the most significant factors in the overall look and appearance of a website. In some cases, the designer may have the sole discretion in making color choices, but many times a color scheme has already been established and needs to be followed. In situations where a company already has a strong brand, color usage for the website can either build or take away from this."

Redesign: When To Relaunch The Site and Best Practices - Smashing Magazine

Redesign: Best Practices - Smashing Magazine

Since many of you are working through redesigning your recipe site, here's an article for your consideration.

Project Recipes | Food Enthused

Project Food Blog | Food Enthused

check out the link above for inspiration...

from your assignment...

Overview

We have been writing XHTML and CSS from the very beginning of the course. We have also been learning about the Web as a unique design environment. In this project we are going to bring them all together to create a web site. All of you have put together a recipe for your demonstration files. For this site you will collect all the recipes from your fellow students and collect them into a finished web site. Your site will include the following pages:

* Home Page
* Recipe Pages (one from each person in the class)
* Table of Measurements

Academy of Art | School of Web Design New Media Blog

Academy of Art | School of Web Design New Media Blog

the official dept blog site...

The Gettysburg Address

To Be or Not to Be...

The previous week, students were asked to style the Gettysburg Address by Lincoln. Some merely used basic tags and put little effort into the style and aesthetics of the page.

To truly make it engaging to the viewer, you must work with the content to make the layout and imagery compelling and readable.

This is what will make you successful.

Pages need to be accessible too. We'll get there.

Students need to make interesting work out of the assignments given each week.

Here's a few sample pages:

0. The Gettysburg Address (bold color, nicely styled)

1. The Gettysburg Address (page)

2. The Gettysburg Address (too much script font)

3. The Gettysburg Address (this meets the basic requirements and only that.)

Ajax loading animated gif

Ajax loading animated gif

need an animated loading symbol? I do, here's many different ones that are free (creative commons)

find the one that works for you!

Free Illustrator Assets for UI Design | CreativePro.com

Free Illustrator Assets for UI Design | CreativePro.com

The User Interface Design Framework is created by Webalys and is free for any use, even commercial. The only requirement is that you link to this page if you use the elements in a published website.

A free User Interface Design tool for Web Designers
* Design faster wireframes and create better mockup deliverables in Illustrator.
* Design usable application interface with hundreds of common GUI elements: just drop them from Illustrator Panels or pick them in the library files.
* Customize easily the vectors GUI elements to your own needs: you can easily resize, color or tweak their appearance.
* Benefit from a consistent UI elements library made by a web designer expert in application interface design.

A flexible GUI elements library for Illustrator
* The GUI elements are based on common interface patterns (accordion, expandable panel, progress bar, tags, slide show…).
* They integrate usability good practices and are perfect for wireframes design.
* They are also a good start for interface application design: the appearance is consistent, they are easily customizable and all states of interaction are provided.

ArtsNet: What Is Art? Vocabulary

ArtsNet: What Is Art? Vocabulary

Digital Imaging Tutorial - Basic Terminology

Digital Imaging Tutorial - Basic Terminology

DIGITAL IMAGES are electronic snapshots taken of a scene or scanned from documents, such as photographs, manuscripts, printed texts, and artwork. The digital image is sampled and mapped as a grid of dots or picture elements (pixels). Each pixel is assigned a tonal value (black, white, shades of gray or color), which is represented in binary code (zeros and ones). The binary digits ("bits") for each pixel are stored in a sequence by a computer and often reduced to a mathematical representation (compressed). The bits are then interpreted and read by the computer to produce an analog version for display or printing.

The Droid: Is this the Smartphone Consumers are Looking For? | Nielsen Wire

The Droid: Is this the Smartphone Consumers are Looking For? | Nielsen Wire: "By mid-2011, the U.S. should be just over 300 million mobile subscribers. If we assume that we will have over 150 millions uses of smartphones (based on our projections) and that 80% of these users will access the Internet and 60% will access video (given the current data trend these assumptions may actually be low), this means that over 120 million mobile users will be on the Internet and 90 million will be watching video. What we have typically called the “third screen” is quickly becoming an extension of the first and second screens (TV and desktop viewing) especially in some key demographics. Note how Hispanics and African-Americans over-index on Mobile Video and Internet Usage."

Games Dominate America’s Growing Appetite for Mobile Apps | Nielsen Wire

Games Dominate America’s Growing Appetite for Mobile Apps | Nielsen Wire: "Americans continue to hunger for mobile phone apps. According to the latest edition of The Nielsen Company’s Apps Playbook, the average number of apps that smartphone app downloaders have on their phones is now 27, up from 22 in December 2009. Broken down by the three major operating systems (Apple’s iOS, Android and Blackberry), owners of iPhones have the most apps with an average of 40 on their phones, up from 37 last December, while Android owners report having 25 apps on their phones (up from 22 last December) and BlackBerry owners report having 14 (up from 10)."

Android Soars, but iPhone Still Most Desired as Smartphones Grab 25% of U.S. Mobile Market | Nielsen Wire

Android Soars, but iPhone Still Most Desired as Smartphones Grab 25% of U.S. Mobile Market | Nielsen Wire: "Multipurpose smartphones that allow users to access the web and email as well as run thousands of apps and share text and picture messages are now 25% of the U.S. mobile market, up from 23% in the last quarter according to recent data from The Nielsen Company. By the end of 2011, Nielsen predicts smartphones to overtake feature phones in the U.S. market."

AFP: 65,000 Android phones shipping every day: Google

AFP: 65,000 Android phones shipping every day: Google: "Google co-founder Larry Page, who also attended the meeting, said the strategy of getting more devices running Android provides benefits 'through more (Google) searches and other things that we do.

'I think you'll see that as those products mature we'll figure out how to make more money from them,' Page said.

Schmidt agreed, saying 'while it's true that we're very happy to give away Android, the applications and the services that can be provided on a very large, very broad framework can be enormously valuable over the next five or 10 years.'"

Compatibility Master Table

Compatibility Master Table: tests of css on browsers and others

The Great WebKit Comparison Table

The Great WebKit Comparison Table: "This page only contains tests of CSS and JavaScript items that work in some WebKits but not in all. Adding more items, all of which are either supported by all or by none of the WebKits, makes no sense — it’s in the items in the table below that the differences between the tested WebKits lie."

JavaScript - Browser detect

JavaScript - Browser detect: "A useful but often overrated JavaScript function is the browser detect. Sometimes you want to give specific instructions or load a new page in case the viewer uses, for instance, Safari."

W3C Mobile Web Initiative

W3C Mobile Web Initiative: "The Mobile Web Initiative’s goal is to make browsing the Web from mobile devices a reality, explains Tim Berners-Lee, W3C Director and inventor of the Web. W3C and mobile industry leaders are working together to improve Web content production and access for mobile users and the greater Web."

There's a link on this page in the lower right corner to check to see if your site is suitable for a mobile device... try it out! bookmark it! try it in december! --> Is your site mobileOK?

Smartphones to Overtake Feature Phones in U.S. by 2011 | Nielsen Wire

Smartphones to Overtake Feature Phones in U.S. by 2011 | Nielsen Wire: "The iPhone, Blackberry, Droid and smartphones in general dominate the buzz in the mobile market, but only 21% of American wireless subscribers are using a smartphone as of the fourth quarter 2009 compared to 19% in Q3 2009 and 14% at the end of 2008. We are just at the beginning of a new wireless era where smartphones will become the standard device consumers will use to connect to friends, the internet and the world at large. The share of smartphones as a proportion of overall device sales has increased to 29% for phone purchasers in the last six months and 45% of respondents to a Nielsen survey indicated that their next device will be a smartphone. If we combine these intentional data points with falling prices and increasing capabilities of these devices along with a explosion of applications for devices, we are seeing the beginning of a groundswell. This increase will be so rapid, that by the end of 2011, Nielsen expects more smartphones in the U.S. market than feature phones."

iPhone vs. Android | Nielsen Wire

iPhone vs. Android | Nielsen Wire

Whether it‘s checking email on the go, connecting with friends through social networks or using turn-by-turn navigation, the capabilities of smartphones are convincing more and more consumers to make the leap from a simple mobile phone to a more sophisticated device. As of Q1 ‘10, Nielsen data shows that 23% of mobile consumers now have a smartphone, up from just 16% in Q2 ‘09.