GRAPHIC DESIGN

Graphic design, also known as communication design, is the art and practice of planning and projecting ideas and experiences with visual and textual content. The form it takes can be physical or virtual and can include images, words, or graphics. The experience can take place in an instant or over a long period of time. The work can happen at any scale, from the design of a single postage stamp to a national postal signage system. It can be intended for a small number of people, such as a one-off or limited-edition book or exhibition design, or can be seen by millions, as with the interlinked digital and physical content of an international news organization. It can also be for any purpose, whether commercial, educational, cultural, or political.

Design that’s to be experienced in an instant is the easiest to recognize. Designers arrange type, form, and image on posters, advertisements, packages, and other printed matter, as well as information visualizations and graphics for newspapers and magazines.
This kind of design is often confused with illustration, but while an illustrator creates or draws an image in response to an idea, a designer combines illustrations, photographs, and type in order to communicate an idea. One way to understand this is to consider the difference between a furniture maker and an interior designer. One makes a specific object for a specific purpose, while the other thinks about how all of the objects and surfaces of a room create an environment for the person moving through it. Good illustrators are often capable designers and vice versa, making it harder to distinguish between the two practices.

Motion graphics are equally predetermined and crafted but are meant to be experienced over a fixed time span, like the opening credits of a movie or an online video that explains part of a newspaper article. They usually go beyond the visual, curating and cueing sound to moving vector graphics, photographs, and video. The difference between motion graphics and videography or animation is the same as the difference between two-dimensional graphics and illustration. Motion graphics combine animation, videography, and typography for a communicative purpose, and this combination over time and the space of the screen constitutes the design.
AIGA

Graphic Design 1

Circles

One of my first, original college designs, taken from the "Fundamentals of Design" class on the "Web Design and Interactive Media" bachelors degree program. The design "Circles" was how I interpreted the following instructions.

Create a element group using 2-4 black and/or white circles of the same size and no stroke. Then, duplicate the form group 2-4 more times, utilizing translation, rotation, and/or reflection to create a black and white design. Experiment with different form groups and layouts to generate a visually appealing composition that is unified. Unified in this instance means the elements you have assembled will look as one larger unit. Remember that the negative space is as visually important as the positive. Finally define the composition space with a border.

circles

Graphic Design 2

Fundamentals of Design - Proposal

Submit a written proposal for your final project. Your proposal should explain the message or theme of your design, and its intended audience. It should also explain how you will use the elements of visual design to achieve these design goals. The proposal will serve as a written plan for the execution of your design. The statement "form follows function" simply indicates the linear progression of the design process. The function of a design needs to be established first, so that the form can then be fully considered.

Also, the function of a design is a solution to a specific problem. The problem that I have recognized is the issues of cost-effective residence, durability of material, and aesthetic quality of standardized design. The common shape of a home is the rectangle, and rectangles within rectangles. While this is a tried and tested shape that has stood the course of time, I believe it is time for a change in shape, and time to think outside the box.

Original impressions (click/tap to view full size)

Solution: I propose to submit a design of a new concept in building blocks. As the name suggests, my target audience will be architectural, building industry, and all general new (or returning) home owners. I will not be the manufacturer, just the designer. It is commonly said in design conversation that form follows function.

This means that the form of a design, or its outward appearance, should be created in service to its function. The function of a design should define its form. The building blocks will not be the traditional rectangular shape or size. They will be pre-manufactured, full sized-room hexagon building blocks.

Wireframe Design (click/tap to view full size)

They will be part of a set and will come complete with door (external/internal), and/or window frames (depending on size, position within home, and design requirements). The material for these blocks will be a strong, fire and weather resistant, reusable material, sizes are likely to be standardized, base and roof will be transferable (multifunctional - one size fits all). Each completed home can either be uniform, or take on a unique shape and size within the hexagon building framework (one/two or more levels).

Creativity remains at the heart of design and the content, meaning, form, and message are a source of inspiration for the designer. Each message becomes the starting point for a new exploration in creativity. The visual elements will be predominately graphic with the obvious "hexagon" element with the look of 3D volume and depth.

Final Draft (click/tap to view full size)

However, balance may also come in the form of visual scenery (the physical surroundings), placement of other architectural or sculptured designs in a park-like, town, forest or marina area.

Harmony with colors and overall geometric rhythm will be a main source of visual communication. The idea is to create a desire and a need. To show a solid foundation, strength and aesthetic qualities.

The challenges I foresee will be, the design, gaining a visual desire, the viability in physical construction, costing, logistics, and basically, getting people to think outside the box and live inside a hexagon.

Graphic Design 3

Creating a Book Cover

Project: Take a classic book-cover and re-create a different version while maintaining relevance with the story.

Catcher in the rye: The story behind the book title is in relation to a poem by Robert Burns, "Coming through the Rye," with the actual words "If a body meet a body coming through the rye." A line in which the narrator (Holden) blindly (with purpose) terms as "If a body catch a body coming through the rye." Holden, envisages children playing in a rye field near a cliff top. The rye is so high that the children do not see the cliff edge until it is to late. With Holden at the very edge, he catches the children before they fall (from childhood innocence into adulthood)

Scared of the adult world, Holden clearly shies away from intimacy and is terrified of his burgeoning sexuality: he is too scared both to call Jane and to sleep with Sunny. He takes refuge in isolation, but this isolation only deepens the pain of alienation and loneliness.
Holden has constructed a simplistic divide between childhood, which he sees as innocent and good, and adulthood, which he finds superficial and evil. This worldview allows him to maintain his cynical barrier of defense: he is able to rationalize his loneliness by pretending that every adult around him is phony and annoying.

Now, Holden is troubled by unexplained disappearances. He is anxious to know where the ducks have gone, since he feels extremely threatened by the idea that people and things just vanish, as Allie did. The pond itself becomes a minor metaphor for the world as Holden sees it. It is "partly frozen and partly not frozen," in a transitional state just like Holden himself and the world he inhabits.

"If a body catch a body coming through the rye."
"If a body catch a body comin’ through the rye."
Holden says that he imagines a gigantic field of rye on a cliff full of children playing. He wants to stand at the edge of the cliff and catch the children when they come too close to falling off—to be "the catcher in the rye." Phoebe points out that Holden has misheard the words—the actual lyric, from the Robert Burns poem, "Coming Thro' the Rye," is "If a body meet a body coming through the rye."

The rye field is a symbol of childhood—the rye is so high that the children cannot see over it, just as children are unable to see beyond the borders of their childhood. Standing on the precipice that separates the rye field of childhood from the cliff of adulthood, Holden wants to protect childhood innocence from the fall into disillusionment that necessarily accompanies adulthood. Trapped between states, with his innocence in jeopardy, Holden wants to be a "catcher in the rye," a savior of the innocence missing in the world around him, a world that has let him fall over the cliff into adulthood alone.

By "catching" children from falling off a cliff, he really wants to protect them from the fall out of innocence into the adult world.

When Holden watches Phoebe go around and around on the carousel, he finds himself deliriously happy as he participates in a scene of childhood joy and innocence. With Phoebe, he seems to have found the human contact he was looking for. The implication is that now, perhaps, he can begin the process of introspection and healing that he needs.

http://www.sparknotes.com/lit/catcher/summary.html

The "Catcher in the rye" by J. D. Salinger has had a number of different book cover interpretations. Included in my design is a ground viewpoint of the high-rise buildings, synonymous with the book's location (New York City), along with the symbol of Holden’s happiness (the book’s protagonist) - the carousel. Above the skyline is Holden’s stated desire to be a catcher in the rye, who rescues children by catching them before they fall off a steep cliff at the edge of a giant rye field.

original book cover

final cover design

Graphic Design 4

The History and Analysis of Design

The Story of Movable Type | Albrecht Dürer | The Renaissance | 16th Century Woodcuts

Rationale: A very brief example of Albrecht Dürer's more famous woodblock etchings. I chose woodblocks over his oil or water color paintings as they represent a much more graphical placement in the history of art (the first medium used for making copies of images).
It also shows the artist as a designer, and one that successfully bridges the gap between the artist and the designer along with the implied constraints/freedoms between both (the artist about self expression, and the designer about communication).

Below are the requirements for this Assignment: (set your Artboard to 300 dpi)

Layout: Landscape orientation (horizontal) Dimension: 11" x 17" (Landscape orientation only) You may scale to 50% if you prefer. Color: Full Color (CMYK) Illustration: two illustrations (no more, no fewer) The illustrations can be photographs or artwork (paintings, drawings, etc.).
Text (body) copy: minimum of 300 words. You may cut and paste information from your research for the text of the double page spread. Do not use placeholder text (Lorum ipsum, etc.)
The original artwork is set to 11" x 17" (A3) at 300 dpi. For viewing on the web I reduced the resolution to 72 dpi, the standard for PC screen viewing.

Graphic Design 5

Creating a Magazine Cover: With the plethora online websites that relate to the science magazines content, one could ask "why print a magazine?" The answer is quite simple, many professionals employed within the genetic engineering sphere are accustomed to handling hardcopy material (official documentation, research papers, etc).

The magazine is an excellent resource of current techniques and fact-finding research that continues to bound ahead in the progressive filed of genetic engineering with constant updates in all relative scientific genres. The "Genetic Engineering" magazine offers a quality, glossy extension to well documented scientific literature, complete with current state-of-the-art macro and microphotographic imagery, along with professionally crafted illustrations. Professionals and students alike, will fully appreciate the solid feel and authentic visual artistry, along with the factual scientific documentation presentation.

Audience description: Professionals in the field of genetic engineering, nano technology, biology, biotechnology, GMO technology, schools, colleges and universities, general public with interest in subject content.

Communication objective: Informal and professional resource of current trends in related technology and on-going research techniques and results.

Content description: Science magazine covering the broad scope of dynamic activities within the genetic engineering, nano technology, biology, biotechnology, GMO technology genres. Magazine not only acts as a compliment towards the website, it offers a monthly publication that all relevant news and updates in the relative fields in with the visual reassurance and feel of a glossy hardcopy.

Magazine Cover

Creative approach: Cover needed to remain relative to science while displaying recognizable subject-matter in an artificial field. While artistic license was required, moderation was the preferred approach. Image had to relate to both the magazine title "Genetic Engineering," and the first subject headline "IBM finds way to build microchips using DNA."

Inline with the company "IBM," and its major products "computer technology," the circuit board was added as a background, and some of the circuit highways were tinted red to assimilate blood flowing through veins. The DNA illustration, and tubular microchip were added to the foreground as the main focus of the subject matter (microchip and reflections added to glass tube for greater effect and realism).

Market: For the professional market, predominantly in medical, educational, and research establishments, with limited copies distributed through major high street stores, newsagents, speciality stores, and online at magazine’s website.

Graphic Design 6

The Sellsheet

Sellsheet

The sellsheet is the printed advertisement on the product's container, that provides the potential customer pertinent information on the new product. The left-side of the sellsheet would be viewed on the back of the "DVD" container, while the right-side viewed from the front, and therefore the most visible to the customer.

This sellsheet is taken from an interactive children's "Pirate" game created in Adobe Flash on one of the "Interactive Media" classes taken during my Bachelors in "Web Design and Interactive Media."

Graphic Design 7

Type in motion concept development.

Even without the audible aid of a cello, this Steven Spielberg film requires little introduction. This movie is the original 1975 classic "Jaws." The first and best of a 3 sequel movie about a great white shark with an insatiable appetite for human prey.

The opening of the movie takes place on a small island community of Amity, and we begin with a young female swimmer enjoying an early evening swim in the ocean, not far from the coastline. This is where we are first introduced to the shark, swimming below the surface and hunting for a meal. The young swimmers splashing sounds catch the attention of the shark, and the swimmer becomes the first of many victims to this gigantic great white shark.

The animated events start with the letter "A" taking on the appearance of the shark's dorsal fin prowling the ocean close to the coastal island of Amity (frame 1). The next frame shows the young female swimmer (the letter S) splashing around near the coast. Frame 3 and the shark (letters A and W) has its victim (S) in its sights, and is coming in for the kill. Frame 4 has the victim firmly in the grip of the sharks teeth (letter W). Frame 5 shows the whole shark made up from the letters "A, S, W, J." In frame 6 we see the shark letters after they have surfaced and morphed into the title of the movie, JAWS.

Storyboard

Type in Motion

Animation duration: 1.11

DANGER

Do not go into the water
Do not feed the fish
Eat at Jo's Crab Shack

Graphic Design 8

Logo's and Branding

While brands perceive a business image as a whole, the logo is a visual identity of the business in its simplest form through the use of a mark or icon.

A "brand" as an organization, service, or product with a "personality" that is shaped by the perceptions of the audience. A designer forms the foundation of the brand, he does not create it. The fundamental idea and core concept behind having a ‘corporate image’ is that everything a company does, everything it owns and everything it produces should reflect the values and aims of the business as a whole.

The images below are from two instructional design applications created for pre-schoolers. The first robot-like character is the brand identity for the application "School Scholar," that instructs children (and their parents) through each stage of school preparedness.

The next image is a teaching tool for young students learning the alphabet. The character "Barry Board" is the brand animated image that appears on the opening application, and takes on a school classroom-board appearance that acts as a familiarizing tool for new student school familiarity, prior to starting school.

A logo is for… identification.
A logo identifies a company or product via the use of a mark, flag, symbol or signature. A logo does not sell the company directly nor rarely does it describe a business. Logo’s derive their meaning from the quality of the thing it symbolises, not the other way around – logos are there to identity, not to explain. What a logo means is more important than what it looks like.

An effective logo is Simple - Memorable - Timeless - Versatile - Appropiate.
An effective logo should be able to work across a variety of mediums and applications. The logo should be functional. For this reason a logo should be designed in vector format, to ensure that it can be scaled to any size. The logo should be able to work both in horizontal and vertical formats.

Below is the logo created for the "Transit Auto Service Center" (TASC). The logo depicts a forward facing car that is made-up from the letters T A S C within the bodywork panels (created in Adobe Illustrator). The logo is fully complimentary to the company’s theme, in both nature of business, and business color usage (predominately light-blue).
A short splash animation opens up the website on the full-size website created for PC viewing, (which offers a better make-up of the logo content through a Flash animation). The logo, along with the website as a whole, was designed for PC use only (prior to the popularity of smartphone use). With overall changes being made to the website in order to meet the extensive range of smartphone usage, the splash screen and logo was omitted in the new responsive website TASC

Splash animation

The imagen8 logo is more my branding that originated back in 1997, when I was working on a stained glass feature while I was in the Swansea Art College (UK). The actual outline has remained faithful (12 pieces of triangular glass with 30/60/90 degree angles) each with extending lengths and separated by leading.

The actual colors and shades of grey I developed in 1999, when I adapted the design to my commercial photography business (Mk.1photo). I wanted a logo that exemplified photography at its base (traditional film photography). So I took six of the seven colors of the visible spectrum for one side of the design (depicting color photography), and then six equal shades of monochrome, from black to white (depicting black and white photography), and formed them as a sensitometric step-wedge (the type used in photographic densitometry).

These aspects formed my branding logo, and while photography is no longer my main form of media, the design does relate to any form of media I work on in my position as an web designer, along with any other form of multimedia experience.