Design Portfolio A collection of design work and illustrations by Carlos Garcia
3
Table of Contents Zoetic Magazine
7
Holiday Change Out
39
Stanza 153 Press
15
Team Member Appreciation Week
49
Safe & Sound
23
Team Training
59
Chalk Drawings
33
About the Designer
69
Zoetic Magazine A study and practice of magazine layout, typography & color.
Magazines and Zine design is where design can commingle with other aspects of fields of art, and is where I learned a lot of basic lessons in typography, layout and styling. In this project I was tasked with creating a magazine that represented a scene or genre that we found aesthetically pleasing. What I wanted to represent when designing the logo and looking at fonts was a sleek, modern style. When doing research for style direction I would often look at magazines like Kinfolk, and Hi-Fructose for inspiration. I liked the simple treatment done to their type, and their use of classic serif fonts. In combination with their use of color, and clean framing/layout for their articles created a strong guide for how create dynamic composition and contrast between blocks of text and visually heavy photos and paintings. Drawing from what I
Zoetic Magazine observed previously, I tried to let my images influence the styling of the layout, but still work to create balance between the copy and the image. A lot the images I used had a lot of blue and orange tones which lended themselves to a complementary color palette. This color choice also influenced the way I treated the type in terms of color and location. I wanted to have the the header be centered and within the top third of the cover, and use a lighter color to have the text not influence the colors of the photo it would be on. This can be seen on the image to the right, while the image on the left can show color samples of the header in two color options (The blues drawing from the sky of the background image).
9
The images on this page are of the same spread, but in two different stages of design. On the left is an early iteration of my first spread in the magazine, on the right is the final version. This spread went through many iterations, but the most major change was in my treatment of the article’s title, Get Out There. Originally I had the text one solid medium grey that was pulled from the image. It was centered, making it lose any form of visual interest. It was lost in the colors of the background, and need to provide more for the viewer to digest. To achieve this, I broke up the title, and varied their sizes and colors to fade more into the background to create a sense of depth and perspective. I chose to color the words in an order that would make you look inspect them before reading, so you would have to determine where the
Zoetic Magazine sentence would begin and interact with the implied perspective. Additionally, the copy over the image felt out of place and unnecessary, so it was removed in the next iteration. I incorporated it into column on the right, using a heavier style to denote it being the by-line. The focus of the article and the magazine is on art and the photography featured, so the layout needed to reflect that. The copy is Didot in two different weights, and the headers are in Majesty Banner.
11
ART
LIFE
// Get Out There // Sewn Together // Quite the Character //
Zoetic Magazine
This is the final cover, for the logo I used the typeface Sullivan as a base and used the pen tool to add in filled boxes. I also wanted to keep it very simple on information, just including the titles for the articles in the magazine and the tagline “Art X Life�. The image on the cover was actually the main influence on the color palette. The color of the sky and the accent blues of the building incorporated the tones and set the tone for the magazine, in art style and direction. A vital part of this whole project was that it allowed me to explore color and color schemes, and how to keep type clean and organized in a setting where it is to be read.
13
Stanza 153 Press A study of type, printing techniques and binding.
In my senior year at San Francisco State University I was able to participate in the creation of a specimen book of all of the type faces belonging to the university. What made it unique is that we handset and printed each book which had a large number of items: over 15 typefaces, 15 additional free choice pages and a few miscellaneous pages. We made over 50 copies and spiral bound them in house. All the meanwhile learning about the anatomy of type, letterpress techniques and practice, and general typography skills. We created a logo, and become Stanza 153 Press, a student ran and operated press at SFSU. Our motto was “Festina Lente�, meaning to work with haste, slowly. That was the lesson I learned from my time here, to work quickly, but with diligence.
Stanza 153 Press The process of setting and printing type is one that takes patience, practice and thought. As unbalanced pressure can result in misprints that can ultimately ruin the design or its intended meaning. With the amount of work we had to do and the time that we had to get it all finished in required efficiency and diligence to operate.
17
Safe & Sound
One of the most important elements of design in letterpress is color, as hand mixing your colors is a common practice. It is important to understand not only the interactions of color, but how to properly mix colors to reach sought after hues. Working on this project allowed me to experiment with a multitude of colors, effects, and schemes that could be achieved through means of process printing and color blending. An example of some of this work can be seen in the ligature from 300 Broadway, which is displayed on the left, several variants of colors were tried before ultimately landing on a “Tuscan Yellow� (using a color pencil of same name to provide a goal).
19
Safe & Sound
This project gave me a hands on approach to the foundations of typography and color theory. I was able to physically set and understand the interactions of different font families, styles and weights in addition to how they exist not just as information, but as design elements as well. A strong understanding of type layout can allow a designer to enhance and complement the meaning of behind what we design.
21
Safe & Sound A mock app design, including branding and interface design.
The project shown in this chapter was my final senior design project for school, it required me to work completely independently in research and development of a design need in my community. For my project I would seek to create an app that would assist people in surviving the aftermath of a natural disaster. This process began with very intensive and wide research on all things safety and disaster prevention on different levels (Goverernment, citywide, and personal prevention). This gave me a lot of insight on what existed already, and what resources were available to for anyone who needed assitance. My goal was then to decide how my app could fit into this landscape and design it from the ground up.
Safe & Sound One tool I found that was incredibly useful throughout this project, was the Adobe application XD. It is a program that allows you to completely mapp out applications or websites on mutiple devices and layouts. This let me full run and test my app and thouroughly create scenarios that people could actually find themselves in
25
Safe & Sound
Here are some of the color samples I looked at and would use throughout the app. In general, I wanted most of the interface to be neutral and really avoid any kind of affiliation with the other screens in the program. Each section after the launch screen features a color scheme based on a gradient seen in the left panel, while the main theme of the app uses the gray swatches seen to the right. The darker gray for a background, the middle tone for sections and lastly the ligher gray for text and buttons.
27
Here are some of the final iterations of the screens for my app. When I began with the designing process, I wanted to start with where the user would really interact with the product. Focusing on effeciency and clarity, I divided the screen essentiall into thirds. The top third would always be devoted to communcation with the user in the form of a question. This is used to help determine what the parameters of the situation are in order to best identify the best course of action. The middle section is where the user can select an answer. I decided to use buttons to increase the flow of the app. If the user has to enter information, it will just eat up valuable time. The final section is where the app offers advice and assistance to the
Safe & Sound user, it can use this space to help calify the question for the user. It also can be used to offer calming advice and instruction to the user as seen in the right panel. In addition to the previously mentioned features, there is also the added return button in the top left corner of the screen. Should the user need to go back to a previous question, or should a situation change, there will always be an option for the user to return.
29
Safe & Sound
On this final page I have the final look for the app’s icon, the logo and the final screens. Among the screens are the user sign up page, the start up page after registration, and the in app screens. I decided to use a primarily grey theme for the dashboard and logo because I wanted to keep the color for actual app usage. This project was an intense dive into a complete design experience, from ideation to research to building a mock app. It offered a lot of great learning experiences on designing for a community and for a purpose.
31
Chalk Drawings Chalk Illustrations and hand lettering examples
While working for Whole Foods Market as a Store Graphic Artist, I had the opportunity to do chalk paintings and illustrations for the store in several of its venues. I was in charge of changing these out on a regular cadence and with a seasonal theme in mind for the majority of them. The following section is a selection of a few chalks that display the process in which I would create and design the chalks, and how a brief overview of how they are drawn. When I needed to do a rendering for a chalk I would typically create a file in Photoshop or Illustrator set at the size of whatever board I was working on. I would typically set type and loosely place source images that I took myself or found on a free source website. I would print these and transfer them with non-photo blue transfer paper, to give me a rough guide to follow. Once I had the guide I would then chalk the rest by hand, using an image as a reference
Chalk Drawings for color and shading. This approach allowed me to give more time to look at the details of whatever I was working on, and give more thought to why I design the way I do, and how small choices can change the look of a piece. I learned that this rule also applied to type, not just images that I was trying to render. Another aspect of this position was that I was also tasked with doing the handwritten weekly sale signs. Which gave me an additional opportunity to examine and begin working on hand lettering, which has now become a passion. Within the past few months I had begun incorporating both into the chalks I was designing. I would choose subject matter that had more complicated labels, and work more on detailing the copy of my boards.
35
Chalk Drawings
This is one of my most recent large back wall chalks, at 22 X 48, it is the largest chalk I work on and one of my proudest. The board shown on the left used several techniques that I had picked up from other Store Graphic Artists and was one of my quickest chalks to date. I felt that I wanted it to be a bold clean and clear statement. This was achieved through minimal color choice, the intensity of the color compared to the background and the weight of the text against the cookie.
37
Holiday Change Out A large holiday themed decor change over for store.
One of the biggest projects of my time as a Store Graphic Artist was my Holiday Change Out, which was a large scale holiday themed decor refresh for my store. This took multiple weeks of planning and work to have done on time and was the first time that I completely handled something of this size. For this section I will be focusing on the chalk part of that project as this was the most design intensive part of the process. Like many projects do, this began with initial sketches and ideations for each board in the holiday set. The image on the left shows the rough drawings I had for each department. They mostly remained the same as the sketches, with the exception of the crab season chalk, which changed the most in the final version (shown later). The timeline for the project required me to be incredibly organized, and to plan ahead as much as possible. For me, this meant creating and sketching like I did, and then having an illustrator file dedicated to the whole
Holiday Change Out set. It was also important for me to create deadlines for myself for each section. For example, I would focus finish a section of cheese on the specialty board, then would switch to do the lettering on another while the cheese dried. Effeciency was key and a skill I was able to improve through this project.
41
These are two of the five completed chalks, the left belonging to our seafood department and the right to our meat department. One consistent element that I tried to use throughout all of these chalks, was a similar color scheme. I tried to make the renderings or whatever imagery was being shown fall under a warmer color palette, or at the very least more earth tones. These chalks show that, but in different styles. The crab being prodeminently orange lended itself naturally to the color scheme.However, for the meat chalk, it was originally a lot darker being mostly dark brown with charred bit. So I had to stylize it and alter the colors to fit the scheme. The reds and browns in the image became oranges and more burnt umbers. For similar reasons, I tried to keep the text white among the different board, and all additional ornaments green or red. Green for
Holiday Change Out places where the predominant color would be one that could create a split complementary palette when paired. The red was mostly used as the background as for banners.
43
In regards to the font and typeface choices I wanted to stay accurate to the Whole Foods Market brand guide. This came down to Rescue, Carton and Cooper (for WFM), as the three fonts that I rotated in and out of the boards. Rescue was used for whatever would be the visually heaviest word on the board, with carton and cooper being used for sub headers or copy if needed. Using this system helped me make consistent style choices and allowed me to still use variety and explore what else could work with varying sized boards. These two pages show the process on the largest chalk in the series, my Buche de Noel. This took several sessions to complete and was one of the more challenging renderings I have done to date. However, the time and attention to detail are what make this stand out as one of my better chalks. This process gave me thorough practice with middle tones, an understanding on how to recreate and
Holiday Change Out properly use gradations and how to correctly visualize and recreate those effects. This whole cake was created using a single brush and 5 different colors in total, the rest were created through blending and through color perspective techniques.
45
Holiday Change Out
Here is the final product, the fully rendered cake. Patience was the key to getting this finished in the end, layering and fine tuning each section. The result however was well worth all of the work, the set all together tied our store together, and showed the power of consistent design. A large scale project like this, that has many moving parts, can easily seem dissonant at first. However, this project showed me that with careful thought, and methodical design choices, coherency can be achieved.
47
Team Member Appreciation Week Collateral to go with a week long celebration of team members.
The culture of Whole Foods Market is and has always been very team member oriented. They often would dedicate a week every year to do things for the company and to celebrate the people that make the store run. I was tasked with creating supplemental store specific signage and collateral to highlight the stars in our store. I have included three pieces from the project here: a poster for our Team Member of the Year award, a new name tag I made for the event and appreciation postcards to give out. This project was also an experiment with hand lettering, and converting hand drawn type to a digital medium. Shown to the left and right are my sketches for the lettering, and how I wanted structure the Team Member of the Year poster. In doing research I referenced a variety of hand lettering samples, I saw that a solid guide using shapes to map out how the type would fit together sped
Team Member Appreciation Week up the design process. I put this in to use by having the organization set early on, allowing me to focus primarily on color choices and stylizing the type. From early on in the development, I also knew that I wanted to have a split complementary color palette, which became pink and orange complemented by green. As for the type I chose to pull from the Whole Foods Market toolkit and use Brush (for WFM) and Avenir (for WFM) for the copy and in a part of the announcement.
51
On the left is the final poster mocked up. With regards toward the formatting, I knew I wanted an image of the team member to be at the center of everything, and the rest of the text to fill the rest of the negative space. I also knew that I wanted to have a clear division between the copy about her, her blurb and the award announcement. The Award itself I wanted to take the most dominance, while the blurb I wanted to make clear wasn’t a part of the copy, and was it’s own entity. The final treatment of the type revoled around 4 colors: Orange, Pink, Grey and White. I wanted to keep some consistency between the different typefaces, so the coloring is where I found the place for it. All of the sub headers and prepositions would be orange. The two important parts, her name and the “year“ part of the award getting pink. The contrast creates emphasis on those two elements, but are still close enough
Team Member Appreciation Week to orange so that they don’t conflict. That also influenced my choice in accent colors.
WHOLE BODY - TEAM LEADE
I ended up choosing to add the wreath to frame the photo of the team member. This was not just to help fill the space around it, but to also work in green to create a split complementary color scheme. The implimentation of the scheme also helps to make the poster complete.
Adrienne is TMOY because of her phenomenal professional growth and impact as an inspirational leader in the store. Adrienne has ascended the ranks from Team Member to Team Leader in just 2 years. In that time, she has worked 53on 3 different teams and in 4 positions. She is a true team player who has risen
notch and well-rounded work performance and has humbly pushed herself to go out of her comfort zone. She is a committed team member who actively contributes to our store culture and a true asset to this company. Her genuine, everlasting happy vibe makes all the difference to those around her and we
“LIVING A IS VERY IM AND A LAR COMES FR QUALITY FO HIGH QUAL NESS PROD COMING T SHARING M
it’s a
Working with you
Another aspect that allowed me to explore different parts of hand lettering were the team member postcard appreciations. Every year when we had team member appreciation week, we dedicated a whole wall to being a place where people could take these cards and post kind hearted messages to other team members. This became an exercise in layout and how to make more expressive type. Shown are two of my favorites from the series of twelve, “It’s a Treat Working With You” and “You Are O-Fish-ially the Best!!” When originally designing them, I drew them on post-it notes to keep them quick and small. I knew that I wanted to be able to have time to refine them and create one or two iterations before transferring them to a digital workplace.
Team Member Appreciation Week I also knew I could save time by having some incorporate a typeface for some of the copy, and found that I could still achieve a more personal touch while being minimal with my time. These quickly became some of my favorite parts from this project, as they were simple and fun.
55
Team Member Appreciation Week
Finally, I ended this project by designing a new name tag to use at our location. This design was influenced by Summer of Love artwork, both from the original 1967 event and anniversary imagery that celebrated that style. In order to achieve this look, I kept my color palette in more muted warmer colors; using accents to create a more colorful design. Similarly to my designs in this project, I also hand lettered the Haight Street logo on the bottom of the badge. With its completion, the name tag felt like a culmination of each of the unique elements.
57
Team Training Collateral created for a team training program.
Cross training is an important part of team member growth and development at Whole Foods Market, and I was able to assist my store in updating the way they facilitated training newer team members. My goal was to try to create collateral that would help incentivize interest in the program. Also to create some way to help convey important safety information and brief descriptions of the workings of each department. As this project had multiple goals to achieve, I worked on it in stages, as to keep my focus on making sure that I am fulfilling each requirement before moving on. My first focus was on the incentivizing of the program. I worked on a collectable series of pins, knowing that the goal was to cross train and increase the knowledge of our team members, each design has a unique feel and look when compared to the others. The drawings on the left show some early sketches for potential
Team Training pins, originally I had tried making them with the idea being that they would be simple, minimal line drawings. However, as I further worked and pushed the concepts I soon felt that the pins would be more effective if they were more fun and approachable. On the right you can see some of my finished icons, I tried to embrace a wider variety of color and line weights. But tried to keep them contents of each button as consistent in its cartoonish style as possible.
61
Team Training
After getting my buttons sorted out, I turned my attention to the pocket guide I wanted to design to give all the additional information. For the contents of the booklet, I wanted to keep it as simple as possible, using only headers and body paragraphs. For the headers I used Carton, it is a heavier font and is also able to be on its own, and hold up as a display type. Carton also feels more approachable and playful with its large bulky serifs. I was also concerned about how it would be reproduced by future team members, so I design it to able to fold into a book format and provided easy guides to show where and how to fold it. Having a smaller booklet allows for this to be a size that a team member could keep one in there apron. Additionally, because it can be easily reproduced if anything were to happen a copy they could be made by anyone who has access to a computer and printer.
63
Shown are the final versions of both the button set and the team training booklet. The final batch ended up having 14 buttons, one for each department that a team member can be trained in. The buttons for the most part are unique from one to the next, but some influence the others. For example, the two are the center for the Beer and Wine departments create a “cheers� effect. Similar details can be found in departments that are similar or fall under a larger category (the beer and wine departments fall under specialty). Team members are encouraged to train and explore other departments and as they collect pins, reaching certain levels would get them gift cards and prizes. In styling the book, I kept the structure as minimal as possible. It was important to keep it this way in order to maintain clarity for the reader. I want whoever is reading interacting with this guide to be able to get the imporant safety information.
Team Training For the cover, I used colors from the Whole Foods Market Brand Guide as well as for the typefaces used. The colors are Kale Green, and Green Apple, and the fonts used are Avenir Next and Carton (Cooper used for the Whole Foods Market title and Spring 2018).
65
Nice Shot of Pins on Name tag
Team Training
This project gave me an opportunity to explore and practice book making and try more thoughtful design. I was able to also explore color and pattern making in a new way, unlike what I had been able to do previously. I had to consider the way they look with one another in addition to how they look alone, this led to a lot of self critique and experimentation. Through much trial and error I ultimately was able to bring everything to a point where I felt they were aesthetically coherent.
67
About the
Designer Credits, info about the designer and links.
About the Designer
Hello, my name is Carlos Garcia and I am a San Francisco based Graphic Designer! I am originally from San Diego, but moved to the city to finish my getting my bachelors degree. After graduating, I decided to stay in the city and try to pursue a career in design. In my spare time I enjoy creating small motion graphics, going out on hikes to take photos and making chalk illustrations. I enjoy being able to be creative and work on projects that allow me to push my knowledge of the medium, wether it be digital or phyiscal.
71
Thanks for Reading
About the Designer
Contact: Phone: (619)-453-9102 Email: cg19362@gmail.com Behance: /cagarcia cgarcia19362 cg19362 cagarcia
73