KaishinLab Archives March, 2010

Curio Alt

Posted March 24, 2010 in Releases, No Comments yet

Context:

I am a big advocate of visual thinking: everything makes perfect sense to me when it’s graphical. Between mindmaps, charts and infographics, I have a lot to experiment with. Enter Curio, a professional brainstorming, mindmapping and project management app for Mac that I discovered last year and have been using since. My only complaint about Curio, deside its considerably high price, was its icon… and you know the rest of the story.

Concept:

A pencil sketch is always the first step in my typical icon design process. This time around I thought outside the box and sketched inside the icon itself… Other than that the icon is designed according to Apple user interface standards… Enjoy!


Raster vs. Vector

Posted March 22, 2010 in SOS Design, 4 Comments

After defining what graphic design is, and what is not, let’s tackle one of the most important things to know about graphics: the difference between raster and vector.

The most important thing to remember is that the distinction between vector and raster graphics is more technical than visual. In other words, it is more about the way graphics are made than it is about how they look like.

Now based on the comparison table above, let’s look closer at the difference between vectors and rasters. The most significant difference between the two is composition, or more correctly the type of data and the way is stored and interpreted by the device (check the chart below for reference).

On one hand, a raster image is a set of pixels stacked against each other with various colors and transparency values. In order to display a raster file, the device (computer, mobile…) determines the relative position, color and opacity of each and every pixel, then projects them with their respective values. On the other hand, a vector image is made up of path-based shapes and lines, stored as complicated mathematical formulas that only appropriate softwares can decipher. The computer draws all the points of a path, links them together then fills the result with the right color and opacity, and this goes for each and every path of the image.

The comparison above shows clearly why raster graphics are unscalable: zoomed in, the device has no other way to enlarge the output than to widen every pixel of the file, resulting in jaggy and pixelated graphic. Vector graphics can be expanded without any loss of quality since the computer has all the data that it might need to display the same graphic on a larger scale. This is the main reason why logos are always made using vector graphics: Be it a match box or a plane coating, it can fit anywhere with exactly the same amount of details.

While the previous graphic was in preview mode, the way we humans see the output, the graphic below is in outline mode: the way computers see the input!

As far as convertibility goes, vectors can become rasters very easily with pixel perfect fidelity, while rasters can be hard to vectorize, with often sub-par results. The reason behind this is the fact that vectors provide much more data about the composition of a graphic than do rasters: moving from raster to vector requires additional data that the computer is in most cases unable to guess perfectly.

So, if vector graphics are this awesome, why are we still using jpegs and pngs? Well, that’s because raster graphics are lightyears ahead of vector graphics in terms of displayability and portability: They can be displayed on almost any device without any software requirements! Vectors can only be viewed and edited with vector design applications like Adobe Illustrator or CorelDraw. (list here)

In a nutshell, raster graphics are more like “hey computer, put these pixels together!“, while vector graphics are more like “hey computer, here is what I want, now draw itt!“.

Credit: The pictograms in the chart are belong to bserv. Get them here.

Online

Posted March 20, 2010 in Blog, 2 Comments

Say what? I am online back again! An avalanche of posts, news and freebies will be coming. Get ready folks!

Design & Art

Posted March 01, 2010 in SOS Design, 2 Comments

Before moving a step forward, I would like to go over a question that seems to fuel an unwarranted debate around the web and elsewhere: the difference between art and design.
What they say:

  • Art is about talent, design is about skills.
  • Art is subjective, design is objective.
  • Art is interpreted, design is understood.
  • Art is about taste, design is about objectives.
  • Art inspires, design motivates.

What I say:

  • Art is art, design is design.

The comparison between design and art is irrelevant, to say the least. Design is a rational process with clearly defined objectives and constraints, whereas art is a free form of expression. Design is utilitarian: it is first and foremost about solving problems, beauty comes second.

The top logo in the example below is more prone to fulfill its design objectives than the one below: a logo’s main mission is to help identify a business or an entity, thus it should be memorable, original and scalable. The left logo contains too much colors and tiny details that would make it look unpleasantly jaggy on a business card: the scalability and memorability has been sacrificed for aesthetics.

Regardless of its artsiness, the quality of design is intrinsic to its ability to achieve initially assigned objectives, in a given time-space frame.

PS: The logos above are for illustration purposes only. They are far from being the perfect examples.