The Most Memorable Google Product Logos

It seems the jury is split on whether Google Product logos are good corporate branding or just a bit too boring and predictable. I am not going to try and convince you either way nor go into any deep analysis of the designs, but I will help you take a look at a few of these logos and showcase what product they represent. All of these product logos appear in clean, simple blue lowercase type alongside the Google logo.

Google Buzz

Google Buzz is the newest social networking tool that rolled out in February. Buzz allows users to share updates, photos, videos, and more. Buzz is integrated with your Gmail inbox and connects you to all your contacts immediately. It can also recommend interesting posts and removes ones you’re likely to skip. Buzz can import your stuff from Twitter, Picasa, Flickr, and Google Reader.


When viewing the logo I was immediately reminded of the AVG Internet Security logo look.

Google Maps


Google Maps
was launched in July 2005. It is a web mapping tool that powers many map-based services.


Google News

Google News launched January 2006 and is an automated news aggregator.

Google Docs

Google Docs was made available on February 2007, it allows users to create and edit documents online while collaborating in real-time with other users.

Google Chrome

Google Chrome is a free web browser that was released in December 2008.

Google Alerts

Google Alerts are email updates of the latest relevant Google results (web, news, etc.) based on your choice of query or topic.

Google Blogs

Google Blogs let you find blogs on your favorite topics.

Google Books

Google Books allows users to search the full text of books.

Google Earth

Google Earth lets you fly anywhere on Earth to view satellite imagery, maps, terrain, 3D buildings, from galaxies in outer space to the canyons of the ocean. You can explore rich geographical content, save your toured places, and share with others.

Google Images

Google Images is a tool that I use all the time to find images online. I love the refined search options.

Gmail

Gmail is fast, searchable email with less spam.

Google Reader

Google Reader lets you get all your blogs and news feeds fast and in one location.

Google Talk

Google Talk lets you IM and call your friends through your computer.

Google Translate

Google Translate makes viewing web pages in other languages simple.

Google Checkout

Google Checkout is a faster, safer and more convenient way to shop online.

Blogger

Blogger lets you share your life online with a blog – it’s quick, easy and free.

Google Desktop

Google Desktop allows users to search and personalize your computer right from your desktop.

Google Finance

Google Finance is all about business info, news and interactive charts.

Google Calendar

Google Calender lets users organize their schedules and share events with friends.

Google Labs

Explore Google’s technology playground at Google Labs.

These are a few of my favorites, what are yours?  Respond with your most memorable logo in the comments!  Also, don’t forget to follow 10e20 on Twitter and subscribe to our RSS feed.

4 Comments

Bookmark this post:
Breaking Down Design & Art Related Social Networking Sites

Some niche social networking sites can seem tough to break into and become a part of the community. One of the best ways to get involved is to study what people in the community are doing and simply join in! Sometimes just hanging around and observing will give you a taste of the language or formalities that are normal for a specific niche or community.

For this post I looked for some specific design and art related social sites and tried to dissect what each site is all about, how they may be beneficial to use and how to become a contributing member with the community.

deviantART

 

deviantArt aims to provide a place for any artist to exhibit and discuss works. Works are organized in a comprehensive category structure, including photography, digital art, traditional art, literature, Flash, filmmaking, skins for applications, Furry and others. DA also has extensive downloadable resources such as tutorials and stock photography. Member submissions are known as “deviations.” The goal of the site is to allow artists and art lovers to interact in a variety of ways, ranging from the submission of art to conversations on a number of topics.

This site is a thriving community. The best way to get noticed and to have the community interacting with your work is to comment, comment and comment some more! Post replies and threads in the forums. Comment on peoples artwork and user pages, use the chat room and the shout box. Give out good and constructive comments, to stand out – many people will like to return the favor. You don’t get anything out of it if you don’t put something into it. In other words, you reap what you sow.

Although all the reviews and comments about deviantART are not favorable. Encyclopedia Dramatica has this to say about the community, “If the art community as a whole had cancer, then deviantART would be the biggest malignant tumor of them all.”

Concept Art.org

A lot of the members from deviantART migrate to ConceptArt.org if their work is of a certain caliber. There is drama here just like in deviantART and most of it seems to come from deviantART members that can’t take constructive critiques.

I like the layout of the site and how they feature certain artists and thumbnails of various artworks. The forums are pretty similar to DA and the heavier threads pertain to critiques and art technique suggestions and ideas.

Flickr

Flickr is a HUGE online photo and video hosting website as well as online community. There is an overwhelming amount of amazing photography and art to view. They have a great search feature and also offer users the ability to either release their images under certain common usage licenses or label them as “all rights reserved”. The licensing options primarily include the Creative Commons 2.0 attribution-based and minor content-control licenses – although jurisdiction and version-specific licenses cannot be selected. As with “tags”, the site allows easy searching of only those images that fall under a specific license.

Flickr groups are a great way to post your photos and get a specific audience. They even have local groups. There are groups for a variety of topics, velvet art is your thing? There is a group for that! Learn about other great ways to market on Flickr.

Flickr has entered into partnerships with third parties to offer printing of various forms of merchandise, including business cards, photo books, stationery, personalized credit cards, and large-size prints, from companies such as Moo, Blurb, Tiny Prints, Capital One, Imagekind, and QOOP. In addition, Flickr has partnered with Getty Images to sell stock photos from some users.

Flickr asks photo submitters to organize images using tags (a form of metadata), which enable searchers to find images related to particular topics, such as place names or subject matter. Flickr was also an early website to implement tag clouds, which provide access to images tagged with the most popular keywords. Because of its support for tags, Flickr has been cited as a prime example of effective use of folksonomy.

Coroflot

Coroflot is the creative world at work. It has grown to host over 1.4 million images of creative work, from the portfolios of over 150,000 creative professionals and students from nearly every country on earth. Coroflot users are industrial, graphic, fashion, interior, textile and interaction designers; 3D modeling and rendering specialists; architects, illustrators, art directors, design managers, and dozens of other disciplines.

There are no membership requirements, application processes, or invites. If you’re a designer or someone who avidly follows creative work, they want you. If your work is good, it will find its way to the surface; if you need inspiration or advice, the world’s most active professional creative community can show you what’s what.

Vimeo

Vimeo, which had the original HD internet video, is a respected community of creative’s that are passionate about the videos they make. Vimeo’s groups allow you to create communities within Vimeo around the things you like. Share and discuss videos, photos, music, and events with other people that enjoy the same stuff. The more you interact with the community, the more interest in your work there will be. Get involved and you will enjoy the rewarding experience that Vimeo can provide.

COLOURlovers

COLOURlovers is an international community of designers and artists of all kinds who visit the site to get color inspiration, ideas and feedback for both their professional and personal projects. COLOURlovers’ loyal members create colors, palettes and patterns to nurture their ongoing love affair with color. They join color-inspired groups and forums and share the love by commenting on their favorite creations.

This community is very passionate about its… color or colour, whatever way you spell it. A lot of niche sites in design and art have a tight community feel already because of the content, that holds true with COLOURlovers. The few times that I joined a forum conversation I was overwhelmed at the amount of support it’s members gave.  You can jump right in on the conversation at the forums by asking questions about specific colors or giving advice on already posted questions. If you need some simple color inspiration this is your spot, these people like LOVE color!

Art and design related social networking sites can at first seem foreign, but once you spend some time and get familiar with the language used and the correct way to get the most out of it – you are set.  What are some social art/design related sites that have helped you?

12 Comments

Bookmark this post:
How to Take Great Photos to Use on Your Websites

When your stock photography just isn’t cutting it and you need to bust out the camera and take some actual photos yourself, you will want those pics to look the best they can. Not everyone has a tool chest full of studio strobe lights, ring flashes or expensive lenses, but quality photos for use online can be obtained with minimal hardware and time. Taking better digital pictures takes practice and a little knowledge of the camera. For this example the subject to photograph will be flat artwork or posters too large to scan.

Tripod

A simple to use, cheap tripod can drastically improve your photographs. A tripod can cut down on and even eliminate shaking of the camera during shutter release. By using a remote trigger to trip the shutter you get rid of shake.

If you do not have a tripod you can get creative and set up some books on a chair or step ladder. To get an angle you can use towels or soft material to tilt the camera.

Lighting

Depending on what your subject is that your shooting your lighting requirements will be different. If you are shooting artwork at home sunlight or natural light is best, when possible. Whether you are shooting photos outdoors or in a room filled with natural light through a window, this is the best choice for capturing most artwork.

When natural light isn’t an option setting up some directional lighting will be necessary. If you have 2 lights of somewhat equal brightness or strength set them up on opposite sides of the artwork to be photographed. The light is best when it is not directly on the artwork but bouncing off of something like a wall or ceiling first.

If you are shooting a 3 dimensional object then strong directional lighting works best. Try playing with the various angles of the lighting. Have one come from behind it and another softer and at another angle, the best option will reveal itself when you are experimenting.

This is a simple lighting setup I created using normal everyday lights:

Flash

Avoid using a flash to photograph your artwork. The flash can cause overexposure from the reflection and create white spots on the final image.

If your lighting just isn’t cutting it and a flash is needed then play with the flash options on your camera to get the best effect for your situation.

Sometimes taping a soft white paper towel overthe flash bulb can diffuse the light just enough to remove any glare from reflections on your subject.

Background

If you are photographing something other than flat 2 dimensional artwork, like a sculpture or a piece of jewelery, a background will be a good way to make the image unified. A neutral or grey background will be optimal to not distract from the subject. Pay attention to backgrounds. Walls are pretty boring; cluttered backgrounds distract. Images that contain many different colors and lots of small detail suffer most when compressed for use online. Plain backgrounds, especially behind faces, help an image reduce well without becoming confusing.

Here is an example of a clean white background versus a more busier looking background:

Simplicity

One of the best tips is to keep it simple! You can almost always improve your digital pictures by zooming in and cutting out all distractions and excess clutter. Also it is better to take lots of pictures than too few. With digital cameras, unwanted photos can easily be deleted.

Save for Web

After the shots are saved and loaded on your computer you may want to go into Photoshop or any image editing software and make some minor image adjustments. May you want to make the shadows darker or crop a photo tighter.

After your image looks good you want to save it for the web. In Photoshop this is an option under the File menu. This compresses the image and saves it at a resolution of 72 ppi for the screen. You can alter the settings to find the best compromise between image quality and file size.

16 Comments

Bookmark this post:
3 Things to Keep in Mind When Designing an Infographic

Infographics are visual elements such as signs, charts, maps, or diagrams that aid comprehension of a given text-based content. You see them everyday and possibly interact with them in the way of subway maps, crosswalk and bathroom signs, and website navigational icons.

Why are infographics useful? A picture is worth a thousand words! Infographics are a useful way to present and communicate large amounts of information in a condensed space. A successful infographic helps a viewer understand a complex issue.

1. Why Should an Infographic Be Created?

Defining the goal of the infographic is the first question that needs to be answered. Is it for data collecting, research or simple discovery? When this question is answered, you can then begin to collect and find the most relevant data. When the data is refined and collected, you then need to find the most effective visual metaphor.

2. Elements

The data or knowledge that the infographic presents is the main element. Secondary elements would be a key which can define the visual elements. Sometimes a scale is used to show relation or reference and also labels for clarification.

Typography is an extremely important element in any design project, and when used correctly it can convey feelings of emotion and emphasize objectives within the layout. If an infographic is about street art in the 21st century, maybe it would be wise to use a font that has a bit of that ’street art’ attitude and is not a sans-serif font such as Helvetica.

Color and contrast help to show emphasis on what is important. Saturation can be added on points that need the most attention drawn to them, while more subtle color can be used in less points of interest. Color is quicker to process than shape, so highlight what is important.

“Paper Trail” by Hannah Fairfield (data from 2005, World Resources INstitute, UN) – Multivariate scatterplot. (Paper consumption per capita x GDP per capita, with total paper consumption and change in paper consumption.)

“The Largest Bankruptcies in History.”  A collaboration between GOOD and Always With Honor.


“Who is Coming to America?” A collaboration between GOOD and Timko & Klick.

3. Keep it Simple

Eliminating any elements that do not contribute to showing off the relevant data can sometimes be the best idea and helps to solidify and condense the infographic’s initial appeal and/or ability to communicate. Use simple diagrams that respect precision, accuracy and proportion. What is the nature of the data? If the goal of the graphic is to represent change, show change. If the goal is to facilitate comparison, display a comparison, don’t do a map.

Infographics have been around for ages. Some maps were being created before a written language was even considered. Infographics can help communicate your data effectively and spark further interest in specific knowledge, and with their current rise in popularity, they can make a viral concept even more successful. The key is to create something visually interesting and well designed. Successfully composing an effective infographic is an art form and requires design principles as well as research and data skills.

Based on your personal experience with infographics, what strikes you immediately about successful graphics? Why do you like some as opposed to other styles?

5 Comments

Bookmark this post:
How to Make a Template Look Like Your Own

Small business owners or site owners who can’t afford to hire a custom designer will sometimes purchase template websites. A template can be considered a pre-made website. A good template design should allow for easy customization. This is a cost effective solution that can work great if the design is handled and molded into the company/site’s brand. Here are some simple tweaks that can be used to reshape a template to give it a little bit more customization and personality.

When you are working with a layered PSD, it is easy to modify design elements such as font, color and overall layout and composition. The template should be broken down and labeled as layers for the main components like header, navigation, content and footer.

Logo

This may be the most important element that needs immediate attention. Most templates give you a generic graphic. If you have a logo, some simple resizing and good placement is all you need. If you do not have a logo, creating one can be as simple as buying stock imagery and some fonts to go along with it.

Most of my website design starts with the logo as the jumping off point. If a company or site already has this part of the process complete, I move forward with the logo’s color, feel or mode to layout the page.

Color

If you have a logo that is going to be used for the template, figuring out the color scheme will be simple. This color scheme will then be used to direct the header, text and content color to some degree. ColorSchemer Online v2 is a great color picker/scheme tool that can be downloaded to your computer (PC and MAC). ColorSchemer also has a great blog that covers various color topics, as well as tips and tools for how to design with color.

Favicon

“If you create a favicon, they will bookmark it.” Ok, all Field of Dreams references aside, favicons are a great way to reinforce your brand. Everything is a brand. Creating a favicon is simple.  When a visitor sees one, it can be a strong indicator that they are in the right place. Here we took the ‘e’ that is in the 10e20 logo and used that as a favicon. Favicon.cc is a simple, easy to use tool that creates favicons, then allows you to download them for easy implementation.

It is cost effective to use a design template for your site, but try to make it your own so you’ll stand out and look professional. Some things are obvious and simple to do while others require more resources and time, but keeping with the idea of a brand and sticking to that brand’s ’style’ will make the design look cohesive and not picked off the shelf.

10 Comments

Bookmark this post:
Reviewing Sass, a Dynamic CSS Language

Dynamic features such as Variables and Functions in CSS have been a hot topic of debate for a while. On one hand, programming-oriented people have been begging for these to be included in the next CSS installments, while countless others are pointing out the difficulties of including these inside CSS rules themselves. One of the main arguments against the Variables use is that it will be much harder to learn and decipher other people’s CSS if developers start naming their own variables for everything.

However, I think languages like Sass make a great compromise. Sass is a higher level language floating above CSS that allows Variables, Mixins (aka functions) and more readable code, while spitting out regular CSS code in the front-end. Visitors to your site can still see regular CSS code, but you can organize it by using a higher level language like Sass on your end.

Here are some of the main ideas behind the Sass language:

table

  padding: 2px

  td.p

    text-align: left
#content

  font:

    family: serif

    size: 1.1em

  p

    line-height: 1.5em

This would generate the following CSS:

table {

 padding: 2px;

}

table td.p {

 text-align: left;

}

#content {

 font-family: serif;

 font-size: 1.1em;

}

#content p {

 line-height: 1.5em;

}

As you can see, the Sass version groups and nests elements for easier readability and less size.

Define Variables in the beginning, like this:

!fontColor = #333333

!padding = 8px

You can then use these variables going forward like this:

#content

  color = !fontColor

  padding = !padding

  p

    padding = !padding / 2

If you’re not familiar with variables in programming languages, the main advantage to using variables is to define them once in the beginning and then use them throughout the code. This is useful if you are using the same colors or spacing sizes over and over. Later down the line, it makes it easier to just change the value of the variable in the beginning, than to change 20 different CSS rules.

Also, as you can see in the above example, Sass allows you to use basic math functions for further customization.

Mixins are equivalent of functions in programming languages. While variables let you reuse one property at a time, mixins lets you reuse whole sections of the code at a time.

First, you define the mixins like this:

=tableDesign

  table

    th

      text-align: center

      font-weight: bold

    td

      text-align:left

      font-weight: normal

or even specify arguments:

=left(!space)

  float: left

  margin-right = !space

Then you can use mixins like this:

#content

  +tableDesign

  +left(5px)

This will produce the following CSS:

#content table th {

 text-align: center;

 font-weight: bold;

}

#content table td {

 text-align: left;

 font-weight: normal;

}

#content {

 float: left;

 margin-right: 5px;

}

Overall, Sass gives you a smaller, more readable code, as well as the power of reusing code with variables and mixins (something many developers have asked for) while at the same time spitting out regular CSS code in the end.

Now, there are still some issues of using these higher-level languages, and I just want to point a few things out.

1. Don’t use these languages unless you know how CSS works inside and out.

I wouldn’t advise for someone new to bypass CSS and just start with a higher level language like this. You should really know what goes on behind the scenes, similar to how Dreamweaver and other WYSIWYG tools can be detrimental if a person doesn’t know basic HTML or what goes on under the hood. However, if you know how to code HTML by hand and know how Dreamweaver works, you can use it to your advantage for HTML content formatting to save time. Similar rules apply here.

2. It may get slightly problematic if you’re sharing your work with other people.

If you’re a sole developer, you should have no problem using your own code. Even if you work within a team of developers, I believe Sass can be utilized for everyone’s benefit. Even though some may loathe the idea of learning yet another language, if you know CSS and basic concepts of variables and functions, this should take you about 5 minutes to pick up. If you’re not familiar with programming concepts of variables and functions, it may take 20-30 minutes but overall this should be easy to grasp for a developer.

The only way this may cause problems is if you’re sharing your work with other developers, or if you’re transferring your site to another developer outside of your team and they just don’t want to deal with anything new.

3. While Sass seems to be a relatively supported language, beware of others that may be more buggy.

As far as I know, Sass seems to work just fine. However, there are many other dynamic languages and implementations out there without any standards or support. It’s important to do your research and beware of buggy platforms. You want to use these languages to simplify your life. If the platform itself is buggy (i.e., generates wrong CSS code at times), there is no point of using it, as it will cost you more time and headaches.

Other Platforms and Examples

Sass runs on Ruby. I don’t believe they have made it to work on PHP yet, but here are some other dynamic CSS implementation examples:

  • xCSS framework – This is an object-oriented CSS framework that runs on PHP5 and has limited overhead.
  • “Supercharge Your CSS with PHP” tutorial – Even though I’m not too crazy on this one, as it does not make the readability better, you can basically use PHP to dynamically write to CSS.
  • Variables in CSS – Here’s another way to introduce variables in CSS via PHP. I find it better for readability than the above example. Although this one still doesn’t have the Nesting or Mixins ability like Sass. It is also developed by one person without any community support.

Who knows, perhaps in the future Variables and Functions will become part of the next CSS standards. But for now, these higher level languages can be useful in the right hands.

If you have any other good dynamic CSS implementations, please feel free to share!

3 Comments

Bookmark this post:
6 Social Media Sites for Web Design-Related Content

If social media is your thing and you also live for web design and pushing pixels, I am sure you are always looking for a few more sites that can feed your cravings for both. Here are a few social media user-generated content sites that focus on design and web design.

These niche social media sites are great because they focus on the content you are after. The homepage will be filled with specific content rather then a general hodgepodge of every type of category. Some of the sites listed below have huge amounts of traffic, and others are just starting out and look promising.

Design Float

Design Float is community controlled content for design. This site has grown tremendously since I first started visiting it sometime ago. By becoming part of the Design Float community, you decide what content is submitted and made popular. The community relies on its members to provide relevant content and rate each entry through “Floats” so that the best and most relevant entries float their way to the top.

Design Bump

This site is very similar to Design Float in that it is a social bookmarking website aimed purely at the design and web community. It’s an extremely helpful place to find both great new design content and to submit your own articles for votes.

Pixel Groovy

This site is a user controlled tutorial directory. Pixel Groovy provide the members, not editors, with the control to decide which tutorials are worthy of being published and which are not. This site has a lot of traffic so the content changes frequently. Pixel Groovy’s RSS feed currently has over 1200 subscribers.

Design-Newz

This is a site that features articles, resources and tutorials written by designers and developers. All articles featured on this site have been hand-picked by a staff of editors to ensure the highest quality. Simply click on a link to visit the source article or browse this site by tags. The site is updated daily with at least 5-10 new articles.

Graphic Design Links

This is another social media site focusing on the Design Industry. Registered users can submit and vote links related to design industry.

Pixel 2 Life

Pixel 2 Life is one of the largest collection of tutorials on the web for web designers, programmers and developers.

 

These sites all feature design-related content and rely on user-generated input. What sites do you check out for all your design tutorials, articles, inspiration and resource needs?

10 Comments

Bookmark this post:
How User Generated Content Sites Can Help Your Design

Crowdsourcing is when someone can post a creative project and sit back and watch as the world contributes ideas through submissions, then the best idea is selected. User generated design sites have always had their share of controversy, and designers/creatives have set up camps on both sides of that discussion. Some say crowdsourcing is evil because it works on ’spec’, while others say that it fills a niche that is cost effective and competitive for designers learning to sharpen their skills.

When I was in school some of my professors would caution us to stay away from these competitions, then there would be some teachers that said it is good practice. I still submitted lots of work when I was freelancing to these sites.

Whatever your stance is on the issue of crowdsourcing design, let’s put that aside and take a look at a few sites and how they can potentially help your design. Some of these are not crowdsourcing designs at all, but rather they are user generated showcase sites.

Web Creme

This is a beautifully simple design showcase site. Think of it as inspirational fuel for your creative fire — the best of the best in design for the screen. I often look through what other designers have done, and this site has a lot to look at and can surely stoke your ideas and have you thinking in new ways. The site offers a link to the designer’s site and also link to the designs being showcased.

CrowdSpring

One of the most popular of the crowdsourcing sites, this site boasts a network of more than [47,000+] creatives from 140-plus countries who vie to provide logo, website and collateral design to primarily small and medium-size business clients.

COLOURlovers

I like this site a lot. It has a great interface and is a simple concept to share and be inspired by color, palettes and patterns. I have this site bookmarked in my inspiration folder and check it out if I need some color ideas. This is a community of designers and artists of all kinds who visit the site to get color inspiration, ideas and feedback for both their professional and personal projects. COLOURlovers’ loyal members create colors, palettes and patterns to nurture their ongoing love affair with color. They join color-inspired groups and forums and share the love by commenting on their favorite creations.

Strip Generator

Tired of pixel-by-pixel painting? Trying to create seamless stripes textures? This free tool allows you to unleash your personal style by experimenting and downloading the tile. You can use it directly in your CSS file or as pattern in Photoshop. The site also has tons of great user generated ideas.

A lot of user generated sites can be very helpful to both creatives and clients looking to find talent in the most cost effective way. There are pros and cons for each, but it surely is a trend that has been growing more and more. What are some great crowdsourcing design or user generated sites you frequent?

6 Comments

Bookmark this post:
Design Predictions for 2010

As 2009 rolls out and the new year comes in, we will see new ideas being born and some old ones leaving us. This is the circle of design life. What will be trendy in the new year? Why should it matter? 2010 doesn’t mean that all new trends in design will pop up; rather, it just might be that the current trends will slowly evolve. Here are some of my design predictions for the coming year.

Icons

In 2010 I feel we will be seeing more and more icons on the web. This icon craze is partly fueled by social media and the great need to have social media icons on websites. They’ll allow users to easily find things like RSS, Bookmarking, links to other social sites, etc. Icons shouldn’t need elaborate 3D modeling and rendering, unless they’re used for other media as well as the web, but I do see this as an evolving and growing trend.

However, tiny, pixelated and flat colored icons have always struck me as more efficient (think ATM machine, browser windows and your smart phone) and conventional to interface design.
icons2

Big Typography

I see typography being used even more as a design element in and of itself, especially big typography. There are so many great type foundries out there creating incredible fonts and giving away some freebies along the way. This way designers have much more access to great fonts now than ever in history.

typebig

Magazine Style Layout

The magazine style look for websites and blogs seems to be dominating. This allows the site or blog to be clean and simply designed, eye-catching enough with photo/imagery and splashes of color, and the ability to show off a lot of content on one page with little previews or teasers of the main content.

voyager-ex

Less Realism, More Minimal

I see a lot less of the realistic trend in 2010, no more paperclips and notepad looking paper. This is is all fluff unless it relates to the content directly. Minimalism is more of the direction nowadays. I see 2010 as a year designers will stop following trends, because that is a trend in itself, and explore their own unique flavor that each designer posses. But… trends are trendy for a reason, and designers should be made aware of them. The point of conventions is that they work and people are familiar with them.

minimal

Maybe we won’t see so much in terms of new trends, but rather an evolution of the current trends. As with everything, in 2010 you can certainly expect the unexpected! What are some trends you see in design for 2010?

11 Comments

Bookmark this post:
Learning to Step Off the Designer’s Treadmill

When do you stop creating and send your work out to face the public? Deadlines can be a motivating factor most of the time, but you can’t perpetuate the design process forever — sometimes you just have to trust that its wings are strong enough to fly. When working on a project like a new tool, a program, design, etc, you have to have a finish date or you’ll just keep tweaking and reshaping and second-guessing until infinity because there will always be new technologies, conventions or new opinions that shake the ground you built on.

dukemI was reminded of this after reading an article on Wired called Learn to Let Go: How Success Killed Duke Nukem. The creator spent 12 years reshaping this video game sequel until finally his company couldn’t keep pace with the speed of technology and had to shut down. “The story was like many suits-versus-creatives relationships: Developers want to make their product superb, and the publishers just want it on the shelves as soon as possible. If the game starts getting delayed, it’s the publisher that cracks the whip.”

The creative process may seem like a lot of smoke and mirrors, but it is a process. Each designer develops a method for solving basic problems, then evolves that method over time. I have a process, which evolves,  that works for me. Sometimes the process is specific to the design problem or general in nature.

The Concept, Research and Discovery

lightbulbThe concept is the starting point of all design; it is the prime mover. Research and discovery play an important role in figuring out what defines the concept as well as what can be added to or removed from this idea. For a website design I will initially look through all the content (text, imagery, logo, etc.) and create a hierarchy based on the purpose of the site. What are all the details of the problem and what is the client’s main goal?

What is already out there that is similar? Researching pre-existing work in the same field by mentors, friends, competitors or legends is helpful to me by competitively analyzing the good and the bad of other work. Plain and simple, learn from others’ works. For some projects I even put together a look book of ideas and images that relate directly to the concept or more indirectly to feelings about certain elements I may want to use in the design.

Form, Pencil Meets Paper

pencilWhen an idea hits, I find that sketching it out on paper in thumbnails or words is still the most effective way to get a good creative flow going, before I even set up a document on the computer. These thumbnail drawings or word mappings (sketching with keywords) are used to gather the basic idea or composition. This is where form is given to the concept.

Content and Digital Implementation

mouseAfter seeing a fleshed out polished version of the thumbnails, I get into the pixel pushing. I flesh out the composition and work to create contrast, tension, balance and areas for the eye to rest with all of the design elements. Here is also where I can be inspired to go another direction. This is where the design can evolve or get stuck on the designer’s treadmill. Sometimes the concept is so specific that it cannot be changed. Other times a better idea is found along the way, and the concept is changed to take advantage of the new discovery.

Feedback, Rinse, Lather and Repeat

shampooClient, friends, mentors or coworkers can provide valuable feedback that can improve the design. This in and of itself can become a cycle of review and approval if not checked and limited. You may not be working on the next Duke Nukem video game, but setting up a design process is helpful and necessary to tracking and monitoring a project’s flow and progression.

Some ideas may come out of thin air, but I assure you that there are no smoke and mirrors behind most design work. Setting goals and milestones for projects can be the motivating factors for completion. However, sometimes you just have to throw in the towel and learn from your success or failure… and step off the treadmill.

7 Comments

Bookmark this post:

Next Page »