process book - caitlin bauman

Prof. Michael B.. LeBlanc Division of Design NSCAD University

Design Studio 1: Principles, Theories and

Practices of 2D and 3D Design

By Caitlin Bauman

LProcess Book

for the course DSGN 2010 Fall Semester, 2010

student_number: 101039

Design Permutations.....................9Grid......................................13

Hierarchy.................19Font Flag...............................23

Mafquack........................27Word Play............................................29

Ugly Web Site Regrooving........33Product/Package.............37

"Home".............................45

32

Caitlin Bauman Caitlin Bauman

Table of Contents

Type Specimen....................5

54


Type Specimen

Fig. 1.1

Date: 09/11/10Title: Final Submission

DejaVu SerifBook

ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz01234567890!@#$%^&*()<>?DejaVu Serif Book 10pt

Dae ea dolupta dolorporro te dolesciur, sent volorro ma perum dolore, nia idelend andaerspid mossimp orporporum fugia ero expla quissit aspitatem destis estrum accupis restota ditem facererum quae consed ut a dolorep erferunt quasinis accus ea nonem fugit alitius etur ra vendigene venda doleste sequisc ianimus et, offi ciistis mo doleste �ent pelest volorio reiciliti omnis es asitaep udicit lit, omnis auda solorei ciendae nes res re repudi untinvelenet et digenis quiaepe rnatur? Quibus duciis expe eum cus arum event.

Georgia Regular 10pt

Dae ea dolupta dolorporro te do-lesciur, sent volorro ma perum dolore, nia idelend andaerspid mossimp orporporum fugia ero expla quis-sit aspitatem destis estrum accupis restota ditem facererum quae consed ut a dolorep erferunt quasinis accus ea nonem fugit alitius etur ra vendigene venda doleste sequisc ianimus et, of-fi ciistis mo doleste ent pelest volorio reiciliti omnis es asitaep udicit lit, omnis auda solorei ciendae nes res re repudi untinvelenet et digenis quiaepe rnatur? Quibus duciis expe eum cus arum event.

Verdana Regular 10pt

Dae ea dolupta dolorporro te dolesciur, sent volorro ma perum dolore, nia idelend andaerspid mossimp orporporum fugia ero expla quissit aspitatem destis estrum accupis restota ditem facererum quae consed ut a dolorep erferunt quasinis accus ea nonem fugit alitius etur ra vendigene venda doleste sequisc ianimus et, offi ciistis mo doleste ent pelest volorio reiciliti omnis es asitaep udicit lit, omnis auda solorei ciendae nes res re repudi untinvelenet et digenis quiaepe rnatur? Quibus duciis expe eum cus arum event.

DV

AGeorg.

AVerd.

ADV

BGeorg.

BVerd.

BDV

CGeorg.

CVerd.

CDV

DGeorg.

DVerd.

DDV

eGeorg.

eVerd.

eDV

fGeorg.

fVerd.

fDV

gGeorg.

gVerd.

gDV

hGeorg.

hVerd.

hDV

IGeorg.

IVerd.

IDV

JGeorg.

JVerd.

JDV

KGeorg.

KVerd.

KDV

LGeorg.

LVerd.

LDV

1Georg.

1Verd.

1DV

2Georg.

2Verd.

2DV

3Georg.

3Verd.

3DV

4Georg.

4Verd.

4In this assignment, we were introduced to both InDesign and the infamous DejaVu font family. We had to follow a set of specific instructions to create a type specimen (see left), which is basically a catalogue for fonts. Three different fonts are compared for your analysis; in my assignment, I chose to compare DejaVu Serif, Georgia, and Verdana.

76


Design Permutations

Fig. 2.1

Date: 09/27/10Title: Final 10 Monograms and Parent sets

98


Fig. 2.2

Date: 09/27/10Title: Monogram breeding: rotational sets and scale sets. Next page: notes and further monograms.

Evolving and Breeding a Monogram Design was an assignment designed to show that there are infinite number of possibilities within any design project. We had to start with our initials (mine, CRB or crb) and create 45 thumbnails of our initials. Then, we created 4 sets of monogram designs, 100 designs in total. One set was created just by rotating the letters, the next was scaling the letters up or down, the third, using various font weights for each letter, and the final was using different borders for our monograms. The final part of the assignment was to chose two examples for our initial set of 45, then one from each of the 4 variational sets, and combine them to "breed" 50 new monograms. From these final 50, we had to chose our final 10 monograms (see the previous page for my final 10.)

1110

Caitlin Bauman Caitlin Baumanc rb

AB

crbAC

crbAD reg border

crbBC

cbrBD-reg border

cbrBA

cbr

CA

crbCB

cbrCD- reg border

cbr

DA -trans-border

crbDB-trans-border

brcDC-transborder

bcrCB

bc r

AB

brcAB

brcAC

rcbAB

crbAC cbr

BC

cbrBC

c rbAC

cbr

DA -trans-border

DB -trans-border

crb cbrDC-transborder

bcrBC

cbrBC

cbr

AC

crbCB

DB -trans-border

crbcbr

DA -trans-border

cbrDC-transborder

brcAB rcbAB rcbBC bcrBC crbBC c rb

AB

cbr

AB bc rAB

crbAC

bcrBC

crbBC

cbrAB rcbAB rcb

AB

cbrBC cbrBC

cbrBC cbrAB

rbc brc cbrBC BC BC bcrCB

cbrAB

crb

c rbAB

crbAC

crbAD reg border

crbBC

cbrBD-reg border

cbrBA

cbr

CA

crbCB

cbrCD- reg border

cbr

DA -trans-border

crbDB-trans-border

brcDC-transborder

bcrCB

bc r

AB

brcAB

brcAC

rcbAB

crbAC cbr

BC

cbrBC

c rbAC

cbr

DA -trans-border

DB -trans-border

crb cbrDC-transborder

bcrBC

cbrBC

cbr

AC

crbCB

DB -trans-border

crbcbr

DA -trans-border

cbrDC-transborder

brcAB rcbAB rcbBC bcrBC crbBC c rb

AB

1312


Grid

Fig. 3.1

Date: 10/05//10Title: NYLON cover grid

Nylon magazine has a complicated layout. It’s difficult to find the exact grid that they are using for the title page, as there are slight differences between each headline. At first glance it appears to have a three column layout, two smaller columns on each side and a larger column down the center. The middle column is 3 3/4” wide and contains a large picture that runs outside the borders of that column and into the side columns. The two side columns are 2 5/8” wide and contain all the magazine’s featured headlines. There is a border of approximately 1/4” on the left and right side of the page, except where the title NYLON runs straight to the sides. There is a 3/8” border between column one and column two,as well as column two and column three, except where some text runs past.

After trying out various grids on the title page, I found that it fits somewhat into a 6 column grid (see left page). Each column was approximately 1 1/4” with a border between each column that measured 1/8th of an inch. The three columns mentioned earlier now fit some-what evenly into the 6 columns. I tried it with the twelve column grid provided in our guide, and it fit fairly well there too.

1514


The table of contents felt more structured than the title page. Here you can easily see the seven columns of the grid, evenly spaced and separated, without the haphazard alignments the predominate in the cover page. Each of the seven columns is 1” wide and the borders measure 1/8”. There is a 1/2” border on the sides and a slightly smaller border along the bottom. There is no border along the top as the title “OCTOBER 2010” runs directly along it, and is in fact chopped off at the top. The columns that contain the contents run at varying lengths into the picture at the bottom right of the page. This seven column layout,

which I traced on its own (see left) was the key in finding similarities between each page reviewed in this magazine (with the exception of the cover.) The seven column grid lined up nicely with both sets of two page spreads. Lines running horizontally across the page lined up in a few columns as well, although usually no more than two columns could run the same line. The regularity of these lines is different than the title page, in which very few lines can run across the page and line up with the headlines on the other side.

This two page spread seems to have a very simple layout. At first glance, it appears to have one word column and one large picture on the first page, and 3 word columns on the second page, again with one large visual taking up half of the page. The first page’s picture runs off the borders of the page at the top and the bottom. The second page has a larger border along the bottom that measures 7/8”.

I decided to try the seven column layout on this spread. And it fit! (See left.) The one column fits into two of the 1” columns of the seven column grid, and the large picture fits into five. The small title block of the picture, as well as the page number on the bottom left, each fit into one column. The 1/2” border along the sides that fit the table of contents also fit this page. On the second page of the two page spread, each of the three columns fit into two columns of the seven column grid. The large visual above the columns runs through all seven of the columns and even beyond the border at the left. Again, the half inch border that was initially part of the table of contents also fits this page.

1716


This second two page spread seemed at first to have little similarities with the first spread with respect to column width. There are one or two much wider columns than the first spread and the alignment is all different. However, this too fits the miraculous seven column grid. In the first page of this spread, the two written columns each fit into three of the 1” seven columns. The border between the seven columns is also the size of the border between the two columns of the article. The title block “Ms. Howard shows herself to be

quite the fetching temptress...” fits into four of the columns, although it runs out into the left border. This headline aligns perfectly on the right of the fourth column. There is no border along the top of this page, like the first spread’s first page, but there is a larger border along the bottom that measures 7/8”, similar to the first spread’s second page. In the second page of this spread, again the column fits into three of the seven column grid, and the picture fits into four. Visually the first spread’s first page and the second’s spread second page are very similar.

1918


Hierarchy

Fig. 4.1

Date: 10/15//10Title: Jazz Poster (Final)

2120


Fig. 4.2

Date: 10/15//10Title: Jazz Poster thumbnails and first drafts

This project was about choosing what information required more prominence than the rest. We were asked to design a jazz poster with a LOT of text and to decide the hierarchy of this information. We researched both "Africa" and "Jazz" and brainstormed what these concepts encompassed. Then we moved into separating the text into its hierarchy, and then to creating a number of thumbnails of possible posters.

Next, we created 6 possible posters in InDesign from our 6 best thumbnails. I ended up going through a number of possibilities. In the end, I went with a safer version than I had intended (see previous page.)

2322


Font Flag

Fig. 5.1

Date: 10/21//10Title: Font Flag (Final)

2524


Fig. 5.2

Date: 10/21//10Title: Font Flag thumbnails and trial flag

The Font Flag assignment was one of my favorites. Font flags are used to "generate interest among designers," so they basically sell a font. We were given the familiar DejaVu font family to work with. The text we used in our flags was important as well, because it had to reflect the font somehow. I began by researching font flags and creating a number of thumbnails. I also looked into the meaning of "dejavu" and thought a lot about what kind of phrases would capture that. In the end, my final font flag used "been there, done that" as its slogan, while my trial flag (see right ) used "Oops, I did it again" which managed to encompass both the concept of dejavu, as well as the look of some sort of spill or accident. I used Illustrator to create my font flags, so that entailed a lot of tutorial time online trying to figure how to create the effects I wanted.

I also used Photoshop to create the ink spill look I wanted for the "Oops I did it again" flag. We were also finally allowed to use color, so I played around with several uses before settling on the grey, black, white and yellow combination.

2726


Mafquack

Fig. 6.1

Date: 11/01//10Title: Mafquack final

2928


Word Play

Fig. 7.1

Date: 11/05//10Title: Ingenious Bankruptcy

3130


Fig. 7.2

Date: 11/05//10Title: Word Play sketch ups; left: research and initial design

The Word Play assignment was another one of my favorites. We were given a negative adjective and a positive noun combination (mine: ingenious bankruptcy.) We then had to figure out to portray the negative noun using imagery that expressed the positive adjective. The assignment was all about semiotics and rhetoric, and understanding that design can be quite manipulative. I began by researching the adjective "ingenious" and its synonyms: clever, creative, and inventive. I found a number of images that could relate to "ingenious." This included puzzles, light

bulbs, neurons or synapses in the brain, math problems, mad scientists, etc. I created a few little thumbnails to explore these ideas visually (see right.) I had to chose a visual that screamed " ingenious" before any other concept came to mind. After our initial critique, I chose to go the light bulb idea, after several attempts working with the Rubik's Cube and blackboard math problem ideas. I used a dark background to make "bankruptcy" light up and draw the viewer's eye. I used both Photoshop and Illustrator in the final design.

3332


Ugly Website Regrooving

Fig. 8.1

Date: 11/12//10Title: BKNS1 Original website (pre-regrooving)

3534


Fig. 8.1

Date: 11/12//10Title: First Regrooving (left) and Final Regrooving (above)

For the Blue Knights website I chose to recreate, I started by getting rid of a lot of unnecessary information that was so prominent on their home page. I cut out the moving images, the scary Scottish music, the distracting background, as well as paring the multiple logos down to one main emblem. I also simplified the links, as a lot of the separate links could actually be combined into one; for example, "Friendship Weekend" could be combined with "Events and Rides" into one main "Events" link, and "Executives" and "History" I combined into one "About" link. I also added a "Contact" link and got rid of the Guestbook links, as I felt that could be included under "Contact" as well. I got rid of the angry red "RESTRICTED AREA" button and added a "Members Login." I deleted the "Welcome to the Web Site" line because I felt it was unnecessary.

When I started recreating the page, I looked through their photos and found a couple that I felt represented the group and managed to be visually interesting too. By adding photos to the main page, it made the site much more inviting. I also researched their main logo and what their motto was, which turned out to be "Ride with Pride." I combined it with the main logo for the home page, and it would be something that remained on every page of the site, along with the top navigation bar. I used a grid that was 24 columns by 16 rows for the layout. I used DejaVu Serif for the font. This website would mostly be used by Blue Knights members and prospective members. I wanted to clean it up, simplify the overwhelming amount of distracting images and sounds, and organize the information to make a more cohesive site.

3736


Product / Package

Fig. 9.1

Date: 11/30//10Title: Final Butane Honey Oil Box

3938


Fig. 9.2

Date: 11/30//10Title: Final Butane Honey Oil Box (side and back)

4140


Pharmaceutical packaging contains a lot of calm or low-key colors. It comes across as very neutral and can at times be coldly medical. The typefaces are generally sans serif, no-nonsense and black and white. The front of the packages usually contain the name of the product, a brief description of what it treats, and often a short description of what the drug is made of. The package's sides and back will offer directions, warnings, and a more detailed list of ingredients. Pharmaceutical packaging is clean, simple and direct. There is usually a prominent grid being used. The packaging uses solid colors and limited imagery.

On the other hand, the visuals for the gambling and gaming industry are in-your-face bright and flashy. They explode off the page with fluorescent pinks, blues, and bright reds and yellows. There is a LOT of information coming at the viewer all at once. There are large titles and limited directions on the lottery tickets I researched. There is a lot of cartoon imagery on both the tickets and the slot machines. They seem to be deliberately confusing. Some tickets, like the The Set For Life ticket pictured above, have over the top "we're so happy and so rich" pictures of people where the scratch areas are. Typefaces range all over the place and are usually giant and cartoonish as well. Lottery tickets and gambling visuals are bright, confusing and flashy. They are designed to grab your attention with the colors and the loud imagery.

4342


Box Template for BHO

5 ml

Uses: • pain relief!• appetite enhancement!• day trips!• mind expansion!And a general feeling of well-being!

5 ml

Utilisations: • soulagement de la douleur• stimulation de l'appétit• voyages d'un jour• élargissement de la conscienceet un sentiment général de bien-être!

Instructions:Inspirez, appliquer localement ou à manger. Visitez notre site Web pour des recettes savoureuses: http://luckygoldenleaf.com/recipes

Dose:Ne pas utiliser plus de deux fois par jour.

Évitez le contact avec les yeux. Ne pas utiliser en cas de grossesse ou d’allaitement. Gardez à température ambiante (15–30°C) et hors de portée des enfants.

Consultez un professionnel de la santé régulièrement si vous êtes diabétique ou si vous soupçonnez être diabétique. Consultez un professionnel de la santé si vos symptômes s'aggravent.

Fabrication par:Lucky Golden Leaf Ltd. (Hong Kong)http://luckygoldenleaf.com

Instructions:

Inhale, apply topically or eat. Visit our website for tasty recipes: http://luckygoldenleaf.com/recipes

Dosage:

Do not use more than twice per day.

Avoid eye contact. Do not use if pregnant or breastfeeding. Store at room temperature (15–30°C), away from children.

See a health care practitioner on a regular basis if you suspect, or are diabetic. Consult a health care practitioner if symptoms worsen.

Manufactured by:Lucky Golden Leaf Ltd. (Hong Kong)http://luckygoldenleaf.com

Box Template for BHO

USES:• pain relief

• appetite enhancement• day trips

• mind expansionand a general feeling

of well-being!

5ml

(tetrahydrocannabinol 98% USP)A potent ex t rac t o f psychoac t i ve cannabinoids derived from cannibis sativa grown in Manitoba, Canada under the strict supervision of Health Canada.

(tetrahydrocannabinol 98% USP)Un extrait puissant de cannabinoïdes psychoactifs dérivés de cannabis sativa cultivé au Manitoba, au Canada sous la stricte supervision de Santé Canada.

UTILISATIONS:• soulagement de la

douleur• stimulation de l'appétit

• voyages d'un jour• élargissement de la

conscienceet un sentiment

général de bien-être!

Instructions:Inhale, apply topically or eat. Visit our website for tasty recipes: http://luckygoldenleaf.com/recipes

Dosage:Do not use more than twice per day.

Avoid eye contact. Do not use if pregnant or breastfeeding. Store at room temperature (15–30°C), away from children.

See a health care practitioner on a regular basis if you suspect, or are diabetic. Consult a health care practitioner if symptoms worsen.

Manufactured by:Lucky Golden Leaf Ltd. (Hong Kong)http://luckygoldenleaf.com

Instructions:

Inspirez, appliquer localement ou à manger. Visitez notre site Web pour des recettes savoureuses: http://luckygoldenleaf.com/recipes

Dose:

Ne pas utiliser plus de deux fois par jour.

Évitez le contact avec les yeux. Ne pas utiliser en cas de grossesse ou d’allaitement. Gardez à température ambiante (15–30°C) et hors de portée des enfants.

Consultez un professionnel de la santé régulièrement si vous êtes diabétique ou si vous soupçonnez être diabétique. Consultez un professionnel de la santé si vos symptômes s'aggravent.

Fabrication par:Lucky Golden Leaf Ltd. (Hong Kong)http://luckygoldenleaf.com5ml

Fig. 9.3

Date: 11/30//10Title: Initial sketch ups (left) and initial Butane Box attempts (right)

The Butane Box was our first packaging assignment. We began by researching pharmaceutical packaging and comparing it with the visuals used in the gaming industry (see the previous pages for the analysis.) Next, we were given the box template and began to do some preliminary color pencil mock-ups of what the drug package would look like if it was done with gaming visuals. I was looking at Set For Life initially, and used the bright pinks, blues and yellows seen on those lottery tickets, as well as the visuals of people busy having fun and being rich.

(Please see right for the Illustrator version.) Next, I looked at the complimentary colors used on a lot of lottery tickets, and tried out a yellow/purple combination, with orange thrown in for added effect. Moving into Illustrator was difficult, as I had to research how to do any of the effects I wanted. The orange was the most jarring color, and after scrapping my initial attempts, I ended up with a fully orange fireworks Butane Box with in-your-face block type. We then photographed our final printed boxes for presentation.

4544


“Home”

What is home?

warmth

family

pets

food

belonging

backyardslovebeds

supportmemories

childhood

christmas

photoscomfort

storagekitchen

heirlooms

laundry

toys

good smells

cleanlinesshousecoat

ownership

colorsmusic

clutter

slipperspersonal space

baking

acceptanceholidays

plants

books

plenty

connection

Fig. 10.1

Date: 12/14//10Title:"Home" brainstorming

4746


In this final assignment, we were asked to create a product or service that related to our idea of home. We began by brainstorming the concept of home and everything it entailed. After our class brainstorming session, I started to think about products or services that could relate to my own personal concept of home. I wrote out a few of my ideas (see above) including a device used to watch memories, a pet rental service, or people who come and clutter up your hotel room to make it feel homey. In the end I went with the idea to create a website based service that would help you create a scent blend that allowed you to re-experience your childhood.

The next step was to present the concept as a two page spread. We planned out layout ideas (see above.) I had to find a way to not only present a scent, something that doesn't have too many visual components to it, but also present memory in a visual way. I felt that part of the scent visual should extend beyond the right page into the left page to bring the two sides together. I also worked on a webpage layout to show the different stages of developing the scent blend: the Memory Scents home page, the questionnaire pages, and the help page. My final design spread is on the following two pages.

4948


Memory ScentsRelive your childhood.

Memory Scents is a product that will allow you to revisit your earliest memories. Your sense of smell is very closely linked to your mind's storage area for your memories. A certain aroma can instantly call up memories and emotional responses that relate to when you first experienced that scent.

Our website, www.memoryscents.com, will guide you through a number of questions designed to trigger your long lost memories and the scents associated with them.

After helping you develop your particular scent blend, Memory Scents will produce it in air freshener, scented oil diffuser, or perfume form. Your custom made scent blend will be sent directly to your house. One use and you will reexperience your childhood!

Visit www.memoryscents.com and begin your journey back home.

5150


The End

52

Caitlin Bauman

process book - caitlin bauman

Documents

consed ut

volorro ma perum dolore

georgia regular

verdana regular

different fonts

infamous dejavu font

course dsgn

fall semester