Mindscape In Cyberspace

While working online, sometimes it really helps to have a handy web tool that allows the users to try and match different shades, design color palettes, pick up the hexadecimal or RGB or CMYK values of the chosen colors and so on. Following are few online color matching tools and sites dedicated to color matching and color palette design, which I find very helpful. The sites and tools listed below, are arranged alphabetically and does not express any qualitative differences between them.

Adobe Kuler
http://kuler.adobe.com/

Adobe Kuler is an amazing color palette generating tool from Adobe that allows the users to explore various color schemes created by hundreds of other users, create their own palettes and share the same with others. One can upload any image or photograph from hard disk and create color palette based on that uploaded image. Adobe Kuler also allows the users to get images from Flickr and create color scheme from them. Flickr members can also login to their Flickr account and their own images to create color palette with Adobe Kuler. The online version of the application is built with Flash, so before trying this tool one should  make sure to have Flash player installed in the system and the browser supports Flash. Once registered, members can save their color schemes and download then as Adobe Photoshop, Adobe InDesign and Adobe Illustrator file.

Apart from the online version, Adobe Kuler has a desktop version, as well. The desktop version can be downloaded from this location and it requires Adobe AIR. The site also has a very good Links section, where various useful articles on color theory can accessed.

ColorBlender.Com
http://www.colorblender.com

ColorBlender offers a free online tool for color matching and palette design. It allows to create and edit a 6-color matching palette (which is referred on the site as a “Blend”) in two editing modes – Automatch and Direct Edit. In Automatch mode, once the first color is selected, the ColorBlender will calculate the value of all 5 other colors and display them on the palette itself. Again, each of these 6 colors of the palette could be edited individually, in Direct Editing mode.

Once the color palette has been created and/or edited, ColorBlender allows its users to download the color palette, as Photoshop Color Table (.ACT) or Illustrator Colors (.EPS). It also allows the user to send the palette or “Blend” by mail. The “Blends” could be saved also saved online, and could be accessed whenever the user returns on the site from the same workstation (provided the user’s browser accept cookies).

ColorBlender has recently won the WEB 2.0 Award for 2008, from SEOMOZ.ORG!

ColorHunter.Com
http://www.colorhunter.com

ColorHunter is an online tool that allows the user to upload an image and create color palettes from the uploaded image. It can also generate color palette from any image available online, once the URL of that image is provided. For each image, ColorHunter can generate two palettes – vibrant and dull and the user can toggle between these two palettes to view them. One can also view the color palettes generated by other users and if the user is registered with the site, it will enable them to share his/her color palettes with others, as well.

Colour Lovers
http://www.colourlovers.com/

COLOURlovers is color and design community for creative inspiration It store thousands of color palettes generated by the members. Designers and color strategists can register on the site to explore various color swatches and color palettes and also share their color creations, color palettes, color swatches, and patterns with other members and non-members.

According to the site, COLOURlovers is a resource that monitors and influences color trends. This community is regularly updated with information and examples of the way colors are used in the real world.

Color Palette Generator
http://www.degraeve.com/color-palette/

DeGraeve.com’s Color Palette Generator is another online tool that allows the users to enter the URL of an image and get a color palette that matches that image. Unlike ColorHunter, this color palette generator tool does not allow the users to upload an image to get a matching color palette. This tool is very helpful for coming up with a color scheme of a web site that matches any key image chosen for the site.

Color Picker
http://www.degraeve.com/reference/color.php

Color Picker is an online color matching tool from DeGraeve.com. Once the hex code of a particular color is provided, the Color Picker generates 4 different 5-color palettes, based on the main color (the hex color that has been provided in the beginning). Clicking on any color swatches will replace the main color with the color clicked and generate another set of 4 different 5-color palettes, based on the new main color. The only problem with this tool is that it understands only hex code and does not accept or provide RGB or CMYK information.

Color Schemes Generator
http://www.wellstyled.com/tools/colorscheme2/index-en.html

Color Schemes Generator is a full-fledged color matching and color scheme generating tool from wellstyled.com. This is one of the most advanced color matching tool that are available online and free of cost. It has a color wheel that allows the user to choose a color as the base color. Once the base color is chosen, user can choose the type of color palette from Mono, Contrast, Triad, Tetrad and Analogic and define the relationships between the colors in the palette. This tool also allows the user to fine tune each palette type, by changing the angle between the colors on the wheel, adding complementary color, reduce the palette to web-safe color. User can also generate variants of the scheme, like Pastel, Dark Pastel, Light Pastel, Contrast or Pale.

The most amazing feature of this tool is the color blindness check option. Once the color palette is generated, this tool allows the user to check how the palette will look, if viewed by people suffering from various types of color blindness, like Protanopy, Deuteranopy, Tritanopy, Protanomaly, Deuteranomaly, Tritanomaly, Full Colorblindness and Atypical Monochormatism.

I have been fascinated by Internet or worldwide web since I was introduced to it, initially as an user and later as a designer, during mid 90s. I remember those days when there were ‘Web Pages’ and how the idea of ‘Web Site’ as “a group of interrelated ‘Web Pages’ seamlessly integrated together to form an information pool” evolved. I noticed how simple formats and default fonts in normal black and underlined blue of the text-heavy sites started getting eager for cosmetic make-overs, often ending up over-doing it, when Graphics were introduced on web pages. How usability experts has started defining the minimalist parameters and how ‘Rich Media’, equipped with high-speed broadband, has overwhelmed the cyberspace with gigs of data. I was always fascinated by the changes of the behavioral patterns of people as they move on from early one-to-one telnet chats to the applet-based public chat-rooms to Webex conferences to voice chats to cam chats. The changes of user psychology that create an complex yet logical mesh of on-line habits as the users evolve themselves from early mailing lists and threads users to someone with multiple profiles in more than one web business and social 2.0 communities and networking sites.

Below are few websites that I like, among all other web presences designed be me in recent past.

Website Design for Altered Black

Altered Black
Being a design shop providing creative design and related services primarily to the corporate clients, I wanted a sober and conservative design scheme, that will eventually make the corporate visitors feel comfortable and confident while visiting this site. At the same time, I also wanted the web site to represent creative ability of the organization and provide sensual pleasure to its visitors. I tried to achieve these goals by using pastel shades, lots of white and empty spaces, a so called ‘Arty’ look, a simple but comprehensive navigation and IA, and a flexible layout that can accommodate enough information about the organization. The site is also well optimized for search engines, has a page rank of 5 and secured its position in Google top ten for targeted keywords.
Visit Altered Black’s website here »

Website Design for South Asia Center, UPENN

Website Design for South Asia Studies, UPENN

South Asia Center & South Asia Studies, University of Pennsylvania
University of Pennsylvania needed a strong visual presence for the websites of their South Asia Center and Department of South Asian Studies to reflect the exclusive nature of these two departments. The main challenge was to create multiple distinctly different visual identities on one single theme and combining multi-cultural characteristics of South Asia on the layouts without emphasizing on a specific one. In these designs I tried to merge various socio-cultural values of different parts of South Asia and meet the visual expectations of people from various demographic zones, by creating ethnic yet cross-cultural design scheme for each site.
Visit South Asia Center’s website here »
Visit South Asia Studies’ website here »

Website Design for Boipara Dot Com

Boipara Dot Com
Boipara is a vernacular literature archive that features alternative Bengali literature, e-books and magazines. I have created an informal design for the site to express the unconventional nature of this particular initiative. The main challenge was to create a template-based design scheme that can be handled by non-designers, later.
Visit Boipara Dot Com here »

Website Design for Films for Freedom

Films for Freedom
This is an on line platform for Indian documentary film-makers, where they can share their views, showcase their movies and organize screenings. A huge group of documentary film-makers led by eminent directors, has started this initiative as a protest against the role of censor board at MIFF 2002. I decided to take up the theme of ‘protest’ for this site and used a photograph of a demonstration by the group as an integrated part of user interface. I have used Courier font for the content, which is not very common in websites, to simulate the feel of manually-typed legal documents or petitions.
Visit Films for Freedom website here »

When a group of scholars and academics involved with a publishing initiative that seeks to bring out significant works on political theory, approached me to design covers for their upcoming publications, I was genuinely very excited. Their approach demonstrated a disregard for the cover and visual identity of the publications. Portraits of writers independently done by recognized illustrators were used, with a conventional serious color scheme of gray-blue, irrespective of the subject of that particular publication. They needed covers for two of their next publications emphasizing the content.

The Paradox of Freedom
View larger graphics

For the first book, “The Paradox of Freedom” my challenge was, how do I express the idea of “paradox” in the context of India’s freedom from British rule, and its emergence as a nation? How do I assemble these ideas with the writer’s strong Marxist viewpoint? I decided to use solid bold text to form a puzzle-like complex structure with flipped and interlinked letters, randomly filled in with the familiar saffron, green and white of the Indian flag. Approximating the look and texture to that of the Soviet propaganda posters, I used the communist red for the background to suggest a Marxist reading. The result was quite effective.

Revolution by Consent
View larger graphics

Designing acover for the second book - “Revolution by Consent” was more challenging for me. How to communicate an abstract idea like ‘consent of the people’? How to represent revolution graphically? I started working with the idea of the mass and abstracted it through a set of hands raised as if in protest signifying a revolution. A closer look at the gesture of the hands in silhouette demonstrates that instead of protest, the hands represent consent or agreement to a cause. The cause is the backdrop - the first few words of the Preamble to the Indian constitution. The red color seeping into the Preamble represents the Marxist framework used to read these historical events.

These 4 logos shown in the above image, are my favorites among all the logos I have designed in recent past. I guess, the main reason for these logos being my favorites, is the fact that I have enough creative freedom while designing them.

Details below: [Clockwise from top-left]

Logo for Altered Black:

Altered Black is a Bangalore-based creative design house, providing Business-intelligent Creative Design Solution for corporates. The idea behind this unusual name of the company, is very simple, as they explain it on their website, “Black altered and altered to black - a double-edged idea that plays on the possibility and impossibility of change. Black cannot be altered. What is impossible is what makes a quest possible. Design, for us, is a journey, a quest to make the impossible possible, and the possible perfect. With dynamism as a core value, to alter and itself be altered, Altered Black is a company that evolves and changes as it alters the world of Design.” I was really excited when I came up with idea of ‘altering’ the ‘black’ by hiding the ‘c’ of the ‘black’, behind the black ink splat. Also, here I have tried to go beyond the conventional idea of standardized corporate color scheme and designed the same logo with the ‘BLACK’ written in 7 different colors, each representing a basic hue. All of them are being used in various materials. Even the employees of Altered Black are allowed to choose the color of the logo on their business card, from these 7 pre-defined corporate hues. The strong message and recognizable visual of the logo, make all logos look consistent and related, in spite of having different colors. The attached image shows the logo in Green, Orange and Blue. You can view few other colors here.

Visit Altered Black Site here

Logo for High Resolution:

It was actually fun to create a logo for a closed group of digital and new media artists, called ‘High Resolution’. The group is primarily aimed to organize online and offline exhibitions of digital art and new media art. All they wanted to have a symbol that is very simplistic, informal and loose, yet represents the technical as well as conceptual meaning of this term ‘high resolution’, a highly popular and often used term in the industry. I put a question before them and before myself as well. What represents ‘the highest resolution’ in our known real world? The answer was obvious - the Sun. And I got my symbol! Now, what could be a simplistic, informal and loose way to represent the visual of Sun and the name - ‘High Resolution’ as text? Who is simple and informal enough to do this? Again the answer came very promptly! Our friend’s 4 year old son, who was hopping and running around us through out the entire session. With little effort, patience and few candies, we got 2 suns and all letters of ‘high resolution’ on 6 different sheets of paper, in various sizes, by him. After that, only scanning and little retouching was needed to get the final logo ready.

Logo for South Asia Center, UPENN:

The logo for South Asia Center of University of Pennsylvania is probably the simplest of this lot, again the most challenging, too. It was really tough to identify one single graphical motif with pan S. Asia feel, considering the vastly diverse culture of South Asia and combining multi-cultural characteristics South Asia in one single alpha-glyph symbol. I realized that it would be easier, if I can go beyond the present time and look into the historical past of S. Asia, for the desired motif. I started looking for graphical symbols in ancient architectural remains of S. Asia, as I beileve, ‘architecture’ is the area, where lots of cross-cultural interactions happened, in recent and distant past, in this region. And, soon I came up with this symbol, simulating and combining the visual charactersitics of various graphical motifs, from the mosaics of Taj Mahal (India, 17th Century), murals of Wat Long Khoun (Laos, 18th Century) and the age-old ‘Gold Leaf Stencil” art form (a popular and religious art form seen on Buddhist temple walls through out South Asia).

Visit UPENN’s South Asia Center website here

Logo for Boipara.Com:

Since, we started Boipara.com, our primary goal is to archive alternative and marginalized Bengali Literature, books, magazines and other published/unpublished material, digitally, on Internet. Boipara.com is a totally non-commercial, non-profit and co-operative initiative that is voluntarily run by a closed group of Bengali Literature enthusiasts, who has a keen interest on alternative and marginal literary forms of Bengali language and literature. When we needed a logo for this initiative, I happily agreed to volunteer. While designing the logo, my first challenge was to express the idea of the co-operative initiative and establish the concept of a ‘group’ behind this whole initiative. I decided to go for a ‘figurative’ logo, a logo with multiple human figures connected to each other visually forming a group, that would represent the closed group of people behind this entire initiative. The next challenge was to express the semi-urban socio-cultural features of this specific group, working within a particular demographical arena. I combined modern stick figures with traditional figurines as seen in tribal paintings in rural Eastern India and added a strong hint towards the informal approach of this group by simulating hand-drawn lines. Once I had the form ready, I tried to illustrate various activities with this figures that could be associated with alternative literature movements in Bengali language and literature and soon came up with a series of hand-drawn tribal stick figures, standing, walking, painting, reading, writing, carrying side bags on their shoulders and so on. I selected four of them to form the graphical part of the logo, based on the activities they are representing, as well as their interrelated visual rhythm. Once the graphical symbol is ready, it was easy to add the textual part. I used a thick marker to draw all required letters, separately, and later combined them to form the name “Boipara Dot Com”, written in Bengali script. Everyone liked the outcome, including me!

Visit Boipara.com here