Portfolio
Chenchen Zhang
Contents Project 01
Form as a Typology / What is Graphic Design?
Project 02
Form as Language / Designing Visual Communications
Exercise 01 Outlining Chapters in “Graphic Design: The New Basics� Project 03
Form as Identity / Logo transformation
Exercise 02 Color + System Project 04
Form as System / Working with a Typographic Grid / Page Layout
Exercise 03 Language of Inter-activity Exercise 04 Graphic Design History / Authorship
Project 01 Form as a Typology / What is Graphic Design?
Let the city and the visible landscape tell you what graphic design is!
The reason I choose Haymarket area as my site is because I take graphic design history into consideration. Walking there, the first element catch my eyes is the bricks. I find many old bricks and brick patterns showing historical evidence. Doors are usually directly connecting with bricks, and there are many different kinds of doors, so I choose door as one matrix and typology theme. Another element I actually decide later, when I’m going through my 200 photos, is shadow. Shadow is a more abstract element in design, but it is everywhere and changeable. I also go to site a second time when I figure out what my three sign matrices are, realizing more examples of graphic design.
shadow sign
index
core
macro
micro
denotative
connotative
objective
subjective
metaphor
door sign
index
core
macro
micro
denotative
connotative
objective
subjective
metaphor
door typology
Project 02 Form as Language / Designing Visual Communications
Find the message content of visual form, and how it correlates with verbal meaning.
When it comes to my design decision, the first thing I think about is the audience of this book. Because mainly my illustration is about an artistic flow, like a paint liquid running from a toothbrush to cover a human hand, I choose children and their parents to be my audience. I named my book “Childhood Art”. In my previous illustration, there is already some white space left, so for me, it’s easier to put words on it. Considering I have an artistic illustration, so I don’t want my typeface to be too artistic. I find out some unexpected effects when I print it out. The gap between the black street image and colorful 3D hand image, the white space becomes a negative shape of a toothbrush. And because I draw color stripes with markers, the stroke itself presents little white parts.
Early Childhood Art
Helvetica
Early Childhood Art
Baskerville
Early Childhood Art
Bembo
Early Childhood Art
Bodoni
Early Childhood Art
Caslon
Early Childhood Art
Century Schoolbook
Early Childhood Art
Clarendon
Early Childhood Art
Didot
Early Childhood Art
Fraktur
Early Childhood Art
Franklin Gothic
Early Childhood Art
Futura
Early Childhood Art
Garamond
Early Childhood Art
Gill Sans
Early Childhood Art
Univers
Early Childhood Art
AR CARTER
Early Childhood Art
AR CHRISTY
Early Childhood Art
Bauhaus 93
Early Childhood Art
AR HERMANN
Early Childhood Art
Matura MT Script Capitals
Early Childhood Art
CountryBlueprint
Amelia Ruscoe
CHILDHOOD ART Ame
lia R
R.I.C. Publications
R.I.C. Publications
Art has traditionally been an important part of early childhood programs. Friedrich Froebel, the father of kindergarten, believed that young children should be involved in both making their own art and enjoying the art of others. This book provides teachers and child carers with a wide collection of colour mixing and media application, printmaking and dyeing activities suitable for young children.
CHILDHOOD ART
usco
e
Amelia Ruscoe
CHILDHOOD ART R.I.C. Publications
Art has traditionally been an important part of early childhood programs. Friedrich Froebel, the father of kindergarten, believed that young children should be involved in both making their own art and enjoying the art of others. This book provides teachers and child carers with a wide collection of colour mixing and media application, printmaking and dyeing activities suitable for young children.
R.I.C. Publications
CHILDHOOD
ART
Amelia Ruscoe
Exercise 01 Outlining Chapters in “Graphic Design: The New Basics”
Scale
Figure/ Ground
-Objectively and subjectively. Objectively: literal dimensions of a physical object. Subjectively: one’s impression of an object’s size. -Developing sensitivity to scale is an ongoing process for every designer. -Scale is relative: depend on the size, placement, and color of the elements around it. Contrast in size can create a sense of tension, depth and movement. -Scale is a verb: vector graphics are scalable.
-A figure (form) is always seen in relation to what surrounds it. -Figure/ ground, also known as positive and negative space. -Stable, reversible, and ambiguous. Stable: form (figure) stands clearly apart from its background. Reversible: positive and negative elements attract our attention equally. Ambiguous: challenge the viewer to find a focal point.
Project 03 Form as Identity / Logo transformation
Create a short narrative about the evolution of a symbol. How can form represent identity? How can form communicate to specific identities?
First, I separate the symbol to many little pieces of fundamental units. I also separate it in another way: keep the basis shape, only dividing into six main shapes. While I am sketching how they can form a new symbol, I notice the more shapes you separate, the more steps you need to come up with a new symbol. Because we need to finish the evolution in six steps, I choose the six main shapes version. To create a smooth animation, I make the actions run successively one frame after another. My new symbol share same visual language as the original one, for example, the same treatment of negative space. I also adjust the evolution steps many times, to add more motion in the process.
Original
Disturbance
Disintegration
Diffusion
Recollection
Reorganization
New
Exercise 02 Color + System
Analogous
Monochromatic
Project 04 Form as System / Working with a Typographic Grid / Page Layout
Visual Organization and Grid Structures / Found Typography and Exploring Typographic Variation
I carefully sellect and cut out type samples from 5 magazines in different field. When I begin to paste them in my sellected grid system, I first consider contrast by putting different size or weight types together. As the grid system is the structure of composition, all the types should be balanced in grid. After trying several layouts, I start to consider positive and negative space, regarding type as image. To create five frames becoming a story, I use bold types flowing from the first frame to the last, like a running black strip. In the process, I create motion in some of my layouts. Using overlapping types makes type has more than one weight. I also consider to celebrate the white space in the grid system, trying different figure ground relationship in composition.
Exercise 03 Language of Inter-activity
HTML: The Language of the Web What is it? HTML stands for Hyper Text Markup Language The main language for creating and displaying information on the web Forms the building blocks of all websites
How does it work? HTML sheets give structure to text, such as headings, paragraphs, lists, links, and quotes, as well as images, video players, and other elements Positions, shapes, sizes, colors, and purposes of elements are assigned specific symbols and type sequences The browser reads these sequences and displays the content as directed
The Wilderness Downtown
Visitors are asked to input the address of the home they grew up in and then the site uses Google Earth and HTML5 to create a personalized music video that takes the user on a journey back home.
Exercise 04 Graphic Design History / Authorship
ALEXANDER RODCHENKO 1891 Born
1920 Director of the Museum Bureau 1923 First published photomontage
CONSTRUCTIVISM (1919- 1922) Graphic designer
1928 October Circle Sculptor 1942 Stopped photographing
1956 Died
Photographer
Alexander Rodchenko was one of the founders of constructivism and Russian design. The term Construction Art was first used by Kazimir Malevich to describe the work of Alexander Rodchenko in 1917. Constructivism was an artistic and architectural philosophy that originated in Russia beginning in 1919, a rejection of the idea of autonomous art. Rodchenko and the other Constructivist thought of themselves as more than artist and wanted their works to implement more than just a picture. Portrait of Lilya Brik, Alexander Rodchenko
Lilya Brik poster, Alexander Rodchenko
Non-Objective Painting no. 80 (Black on Black), 1918 In Rodchenko’s “Non-Objective Painting No. 80 (black on black)”, he uses a black backdrop, representing the sense of space or an extension beyond the painting itself. Infinity can also be shown in the form of shapes. The spiral in the painting signifies infinite movement. Three-dimensions, itself implies space beyond the picture.
Franz Ferdinand album You Could Have It So Much Better
“We had visions of a new world, industry, technology and science.” Alexander Rodchenko
Mike + the Mechanics album Word of Mouth
http://gdh.2rsolutions.cz/ http://02varvara.wordpress.com/ http://mobiletest.moma.org/ http://www.posterdb.de/ http://www.theartstory.org/
Portrait of Lilya Brik, Alexander Rodchenko
Lilya Brik poster, Alexander Rodchenko
Franz Ferdinand album You Could Have It So Much Better
Mike + the Mechanics album Word of Mouth
His portrait of Lilya Brik has inspired a number of subsequent works, including the cover art for a number of music albums.
Non-Objective Painting no. 80 (Black on Black), 1918
In Rodchenko’s “Non-Objective Painting No. 80 (black on black)”, he uses a black backdrop, representing the sense of space or an extension beyond the painting itself. Infinity can also be shown in the form of shapes. The spiral in the painting signifies infinite movement. Three-dimensions, itself implies space beyond the picture.