Right now, there is so much we can do with jQuery but young designers (and even developers) go borderline crazy with it. As opposed to really assessing the demand for a special effect, more and more coders are just throwing things in. As bad as a flat site is an overwhelming one. Both can cause disinterest or user paralysis. Remember, don’t just code clean..think clean.

The property @font-face makes reference to a CSS rule that allows you to download a particular font from your server to a webpage so people are able to see it without having the font installed on their local machine. Until a few years ago, there were just a few font families that were readable from any PC, because they usually came installed in every PC, such as Arial, Helvetica and Verdana. So, the moment has arrived when you can finally use the fonts you want. Check it.

YES! The above image is a of Justin Bieber’s fancy feet. BUT in a way, every dance move Bieber makes is a move we can metaphorically code on the browser using jQuery. I’m going more into “sliding” in this particular how-to. After understanding of the basic steps, it’s your challenge as a student to work your brain to come up with the logic and script to output results you want. As a student, and as quoted in the previous post, you must carefully write/combine your scripts (“stories”) to produce mor complicated applications.

The way you approach logic is simple…think of it like a story to be read aloud. External scripts, like the ones you have been writing, are tiny stories that get plugged into the html file that binds them altogether. The order in which the html file binds them altogether is completely determined by you. Scripts are read like book spreads – left to right, top to bottom, one-line-at-a-time. Read more.

We did a rather rapid in-class lesson on the basic guidelines of coding in Javascript and jQuery last week. Because it was a rushed one-hour lesson, lets continue it this week. I’ll go more into various events, effects, and tricks to trigger. While there are multiple ways to achieve the same animation or action/reaction, there are protocols or methods that are better than others. Continue reading for an overview.

There are five (5) paradigms that are particularly salient for designing and evaluating interactive systems. I’m going to skip the third and last ones called Visibility and Thickness of Practice. The remaining three are broken down here with three questions you need to ask yourselves regarding your Museum 2.0. The three themes are “Thinking Through Doing”, “Performance”, and my favorite “Risk”.

A few weeks ago I was talking about the beauty of white and how we’re finding it being used to the max…probably because of Apple’s smart marketing and branding. During the 90s, seemed like everyone was going stark and dramatic. Perhaps this was an influence out of the grunge era. However, we have a couple of examples below that use that starkness to the benefit of their concept and message. Check them out.

Paper prototypes or other mockups are used clarify requirements and enable draft interaction designs and screen designs to be very rapidly simulated and tested. Low-fidelity prototypes are really about what, not how. When you are designing new interaction techniques, the how is often the most important part. How does the system respond to the user? Does it feel responsive? Does it feel natural? Is it cumbersome or repetitive?

The web has been around for a while. The practice of designing the web has been taken seriously about a decade ago. And now, we’re testing the creative limits. I’ve included in this week’s www a site from 2004 to showcase this evolution of web trends. Let me know what you think.

MIX is a gathering of developers, designers, UX experts and business professionals creating the most innovative and profitable consumer sites on the web. Sessions range from technical, code-based topics to expert advice on content strategy, usability and design. This week’s www is dedicated to showcasing some of their projects.

From the book called ‘The Participatory Museum’ by Nina Simon, here’s a dosage of Chapter 1 – Principles of Participation. Whatever role they play in your institution, participatory elements must be well designed to be useful. Poorly designed participatory experiences do little to enhance anyone’s experience. Take a step back and read this.

The growth of social Web technologies in the mid-2000s transformed participation from something limited and infrequent to something possible anytime, for anyone, anywhere. New online participatory tools like blogs, YouTube, and MySpace can be powerful and valuable. How did they become so successful, so popular, so quickly? It’s all about control, trust, and explorability for the user. Learn more.

As New Yorkers, we all think that everything looks great with black. That could be very much true. However, dear designer, black can be applied dangerously to the browser. As a backdrop, it’s immensely powerful on the eye and the emotions. Check out the below sites about how they play with it in their conceptual themes.

We’re debugging now. A majority of your midterm should be completed. Review presentation guidelines for Monday that were posted a while back. For this upcoming Saturday, I’m dedicating four hours of pure panic-release. If you’re stuck or need help on resolving last-minute issues, come to this jam. I’ll also review new tricks.

Usually there is no “right” way to build a website. If there were, a lot of websites would all look the same. What matters is creating a site that integrates its many elements to meet a particular carefully thought out goal. And the only way of really being sure how well it does that is to conduct some usability testing.

White can be a challenging color to work with. Black and white are at two ends of the spectrum. One on top of the other can be hard on the eye. Great tricks in web design have been designing with colors that work as compliments to gray tones. Check out these museums, libraries, and galleries who are using white effectively on their front page.

Check out the participatory and/or smart nature of these interactive experiences that these website lead. This is next phase of website information and engagement. Do some out of the box thinking with the your projects. After all, there’s so many ways we could experience information and stories. What’s your creative way of conveying such material? Look at these precedents.

No matter what you’re designing in HTML and CSS, you should know by now that everything is a box. By the time you take your styleframes and translate them into web documents, you might find it hard to work the numbers you have in your comps (especially if you weren’t taking them too seriously). Learn more about how to set up your own grid system.

Check out the participatory and/or smart nature of these interactive experiences that these website lead. This is next phase of website information and engagement. Do some out of the box thinking with the your projects. After all, there’s so many ways we could experience information and stories. What’s your creative way of conveying such material? Look at these precedents.

Web is not print. Print is not web. There are things that work, things that don’t work.

Just like picking out your color palette, typography is as equally important. It’s need to legible. Remind yourself of the guidelines featured in this post.

Designing a taxonomy system helps the user filter content. It’s another way for both organizing and navigating content. I find this to be one of the most intriguing things when comparing the web ten years ago to today. Learn and check out a couple of guidelines and examples here.

Navigation is concerned with the connections between the different displays that are available in a hypermedia system or product. Designers can think of the overall arrangement of these connections as forming a structure through which the users of their products are going to be navigating. This need to be an early – and frequent! – part of your design process. Read this post as your fine-tune your wireframes.

Here’s a quote by Joshua Lane: “The best way I’ve been able to sum up Interaction Design” is that it is “blueprinting user behavior”. The whole picture of the entire process flashes before your eyes in a single second. We have a lot of work ahead of us. Before tackling styleframes, you need to nail your wireframes. Iterations upon iterations is completely part of the entire design process.

Patterns are used like building block or bricks. They are fundamental components of a user experience and describe interaction processes. They can be combined with other patterns as well as other pieces of interface and content to create an interactive user experience. Check out ways to make your redesigns modern and friendly.

The disciplines of interaction design and architecture share a number of common traits—such as a focus on solving problems for people and encouraging people to interact with products and environments in new and exciting ways—and each discipline can learn much from the other.

At the moment, all of you have yet to refine your diagrams to portray an accurate and sophicated landscape for your prototype, prior to production. The goal is to make it understandable and easy to visualize before getting dirty in the code. Information design and architecture for the web is more complicated than for print. Learn why through this article followed by how to best approach your schematics.

It’s not story-telling to put me to bed. It’s about summarizing for your viewer/reader the beginning, a middle and end to keep them enticed and wanting to hear more. Make us think with the bare minimum. Then we have something golden. If stories are told well, then we are inspired to learn more or act. First formal presentations… not bad, not bad. But I’ve detailed some suggestions that should be taken seriously and maturely in this post.

You will be presenting your research and solution pitch this evening. Each group will have about 15 minutes to present followed by ten minutes of feedback from peers and myself. Order follows here: 1) Slow Food NYC, 2) RelightNY, 3) Bike New York, 4) New York Historical Society, 5) World Water Organization, 6) Green Dot NYC. Good luck!

Information architecture is the work that goes into creating intuitive navigation schemes for software. In our case, information architecture applies to websites, but can also apply to web applications, mobile applications, and social media software. It’s definitely a term that’s getting used more and more these days. We had a discussion in class about what to do when the maker realizes he/she has ‘too much’ information to organize? Read this tutorial on how to get your thoughts and ideas visualized.

At the 2008 Serious Play Conference, Tim Brown asked the audience to take the piece of paper they had been given and quickly draw the person sitting beside them. After their 30 seconds was up, the group was giggling, embarrassed and apologizing to their neighbors. We did the same exercise as a kickoff to our first phase in group collaborations. Read more about why we did this exercise.

Great job on the first assignment, cats. I was really impressed. Keep pushing it to the max. I have provided some of my afterthoughts in this post. I have yet to photograph all of the works so please stay tuned as I continue to populate this posting. Also, I apologize but I got caught in the snow storm when transporting these home.

To me, Tim Berners Lee is the real ‘dude’. (If you haven’t watched The Big Lebowski then that previous statement isn’t funny). A lot of us interchange the terms ‘internet’ and ‘world wide web’ on a regular basis. They are in fact DIFFERENT. Today we’re going to chat some about how data is hyperlinked on the web in order to produce relationships between sets of information. In the end, all of these links make a narrative, an experience, tell a story, or produces a network.

Interaction designers strive to create useful and usable products and services. Following the fundamental tenets of user-centered design, the practice of interaction design is grounded in an understanding of real users—their goals, tasks, experiences, needs, and wants.

The Internet started in the 1960s as a way for government researchers to share information. Computers in the ’60s were large and immobile and in order to make use of information stored in any one computer, one had to either travel to the site of the computer or have magnetic computer tapes sent through the conventional postal system.

The process of web design can be compared to the process of writing a research paper. With attention and care to detail, you increase the chances of creating a website that is well-organized, easily navigable, and very user-friendly. If visitors get lost or become confused while attempting to surf your website, they might hit the back button and look for a more user friendly website.

There is no excerpt because this is a protected post.