DESIGN HERO: Rei Kawakubo
Communications Studio | Spring 2021
TABLE OF CONTENTS
1. Poster
2. Booklet
3. Mobile Experience
4. Video
5. Responsive Web Experience
EXPLORING DESIGN HEROES
To begin my process, I began by searching for my design hero. I don’t have a specific group of designers I look to for inspiration (although I might start doing that now), I have always been interested in getting to better understand non-American design(ers) so I started there.
In my search, I came across a few people that really stood out to me: Willi Smith (he is American), Rei Kawakubo and Sang Soo Ahn. I was intrigued by how each of them became the trailblazer in the work they pursued, be it streetwear, Korean typography, or the whole fashion industry.
After doing some more in-depth research, I ended up choosing Rei Kawakubo as my Design Hero. In order to better understand who she is (as a person and as a designer), I made a style guide detailing common trends in her work with colors and typefaces that were appropriate to her.
I began to dig around the internet looking for photos and articles to widen my library of resources. However one thing I am getting concerned with is having enough pictures that are high enough quality,
Looking through books, numerous articles, videos of her work at Paris Fashion Week, and even having seen her work displayed at the Met, I was able to write this essay.
I explore three key spaces in her career/life so far:
- her background (as a non-designer),
- her design process,
- how she feels about her own work,
- and why she is my design hero.
PART 1: POSTER
Sketching + Ideating
Now having chosen Rei as my Design Hero, I began my process to design my poster about her.
Here are some things that I need to include:
- A portrait of Rei,
- Images of her work,
- A body copy introducing her and her work,
- Some kind of callout, timeline, or diagrammatic explanation of her career.
With these components in mind, I printed out images of some of Kawakubo’s designs and sketched some ideas inspired by each collection. Throughout this process I wanted to see how I could explore. Although they were very low-fidelity drawings, I wanted to have a direct reference in the early stages of my sketching. In this point of the process, I want to explore different textures and the implementation of her work as larger pieces of imagery to encapsulate the overall atmosphere surrounding Kawakubo.
I began diving into different compositions, bringing in components like Japanese characters, illustration, and even exploring type as more prominent elements of my imagery.
After those few sketches, I explored a wider range of ideas through hand drawing. In this process, I was trying to explore imagery that reflects a few key themes I found in Kawakubo’s work:
- dichotomies,
- being resolute + detached (from her work),
- and her range of work.
After sketching my ideas, I felt like I had to try and digitalize some of them to better visualize any concepts that I had ideated. This is one thing I’ve always realized about myself
Some of my ideas translated very differently from the sketch to the digital iterations. I was once again reminded of how impactful texture and color are in print work; the elements present in photographs could not have been translated in pencil sketching.
However, this does make me nervous of my reliance on photographical artifacts for my poster. As my selection of imagery is limited to photographs of Kawakubo’s work (usually from fashion shows or photoshoots), I lack a uniform set of imagery, possibly making it more challenging to create a visually cohesive composition.
Feedback from Brett + class:
- There is something interesting going on with the silhouette idea–however, including the models’ faces and their entire bodies can get quite distracting. Try zooming in on the textures and the fabric itself.
- Continue exploring digital photo manipulation as there are so many possibilities in how I can create a new image from the photos.
More In-Depth Iterating
After the check-in from class, I started to make more refined poster iterations of my ideas. Because I had only gotten around to digitalizing a few of my sketches, I took this time to try another idea that I had been interested in exploring.
In this new idea, I turned the different assets into patches in order to evoke a more playful and colorful side to Kawakubo and her work. In order to make this approach convincing and compelling, I needed to incorporate textile textures to overlay as the base fabric.
I thought incorporating these texture overlays could be an interesting way to introduce depth in addition to contrasting the flat illustration style of the patchwork design.
After trying out a few textures, I began pushing the patch/sewing concept a bit more, trying out different styles to express the fabricated aspect of the patches. Through this patchwork idea, I tried to explore the idea of her and work (specifically her brand, Commes des Garcons) being seen as a singular entity, ‘sewn’ together in my poster. In addition to these posters, I continued to explore the silhouette idea from my previous sketches and iterations. I was able to develop these two ideas to bring to class.
Feedback from Jaclyn + class:
- The cropping of the fabrics/clothing in the patchwork approach makes it hard to understand what is being shown. The abstraction of form to emphasize texture and fabric in turn compromises the context of the work.
- The patchwork detail is not communicating as strongly, although it is a meaningful approach.
- The faux-3D text is cool! Is there a way to introduce more materiality or dimension to the rest of the picture?
- I still have time to explore my ideas and approaches so try some more!
I also met with Brett the same night:
- Keep the patchwork idea (for later on) but don’t pursue it for the poster. The (hero) imagery in the silhouette idea is so strong and captivating.
- The exploration with black and white in her name is interesting.
- Less emphasis on the Japanese characters (although I can understand why Brett suggested this, it was definitely an interesting suggestion to make).
- Cool use of the asterisks but need to resolve text.
After Brett, I also met with Hannah (I’M SORRY EVERYONE)…
- The faux-3D text is kind of distracting. It’s cool but kind of clashing with the style of photo manipulation going on in the silhouette.
- Explore composition and contrast.
Exploring a Single Idea
I decided to go with the silhouette approach. I think with this idea, I can best represent the energy from her work. I think the sense of stillness and ‘potential energy’ is captured well with the portrait.
In order to get a more comprehensive view of my progress so far, I put my iterations next to each other. I’m definitely happy with the progression I made in terms of composition and subject matter. One thing that I feel has been constant throughout is the impact of the hero image. Even though I am altering the surrounding elements and playing around with the work shown in the silhouette cutout, I think the statement of having a large scale portrait of Kawakubo in the center is definitely something that stands out to me.
Crit Day!
Final Poster
Takeaways
Working on this poster was a huge challenge in terms of scale. This is definitely one of the bigger (maybe biggest) project I’ve worked on; designing a large poster put so many things into perspective, especially the illusion of the computer screen. Everything is a lot more extreme when printed: big type gets bigger, small type gets smaller, thin lines get thinner, and imagery stands out even more.
Importance of composition (can be driven in many different ways)
- Printing is so hard: print design requires not only the designing skills but also the practical aspect of being able to create a tactile object.
- Exploration in breadth helps me inform the final outcome
PART 2: BOOKLET
Sketching and Flatplans
To begin our booklet, we were asked to bring 5 complete sketch ideas to class. For these sketches, I wanted to explore different ways of showing her work, especially something that was different than my poster. Not that I necessarily want to ‘rebrand’ her image from something my poster was, but I wanted to at least try to approach the booklet with a different representation.
Having brought them to class, I think I know where to go next. I was able to highlight some of the ideas that Brett (and I also) happened to be intrigued by. A lot of these explore scale and contrast between elements present on the page. I am excited to continue the working process.
First Go at Digitalizing the Booklet
Right after class, I began working on digitalizing my spread ideas. Once again, it helped SO much and completely changed my impression of some of my spreads. This process definitely helped to get me on track and toss some ideas out and pursue others in a more efficient manner without leaving me to feel like I wasn’t able to explore.
I used Figma to work fast and get a ton of quick iterations out of my system. I was exploring a few different versions of a table of contents in addition to a few spread layouts that are a bit more versatile in the nature of the content that it can hold. At this point, I haven’t really started looking at everything as a booklet as opposed to individual spreads. This might be something that I want to start considering ASAP but I’m happy with the progress I’ve made so far.
Things to Consider:
- What kind of approach should I be taking? When is the right time to make a decision (in regards to the timeline of the project)?
- How different can my booklet interpretation be from my poster?
Class Crit + Considering the Whole Booklet
For today’s class, I brought an iteration of a fully considered booklet to class. I tried exploring different styles for my table of contents, experimenting with some playful + textured styles to more sterile + graphic versions.
After class, I felt like I was in a good place as I had gotten a bunch of iterations and explorations under my belt. I tried printing some of my spreads out to see the differences between a screen and a sheet of paper. I noticed that everything thats big looks a lot bigger and everything small is much smaller. The contrast is not something I intended and I’ll have to adjust my work accordingly.
Meeting with Brett (the night before):
- Looks great so far! The spreads are cohesive and a lot of it seems very considered. Good structure + workflow.
- Consider folios and page numbers. Large page numbers might be fun to explore.
- Try out the super small model cutout timeline; it seems interesting. The contrast in the micro-analysis from the bigger, bolder spreads is good.
Bringing in Structure
At this point I began implementing a grid and transitioning into InDesign to make more precise and finalized designs.
3/18 Crit
Below is the work I was able to bring to class for today. I was able to introduce page numbers and tweak things within a grid to refine the layout a bit more.
Jaclyn + Class during Crit:
- Looks cool so far!
- Big page numbers might be contrasting with the type in some spreads.
Meeting with Hannah after printing my booklet:
- She likes the booklet so far! Everything feels cohesive and well structured.
- Large page numbers are cool and they are working.
- Switch the portrait and the table of contents on the second spread.
Meeting with Brett:
- Bring essay into Black quote part
- Don’t need 14 (page number)
- Back cover: Rei*Kawakubo middle (where her face is) and credits at bottom
- Unify big type: All mixed case for consistency, Leading (percentage), maybe 2 point sizes
- Try to resolve“Her Impact” page
- Lay in captions
- Timeline: Identifier numbers can be smaller
- Give yourself a system
3/23 Crit
3/23 Crit
At this point, I still have 1–2 spreads that I’m not super sure about. But this is the progress I brought to class.
I think general, there are still too many big things; in this flatplan view, the necessity of my center “30 Years of Creation” spread is really showing; the break from super big imagery and type allows the reader to get a bit more intimate and explore the page’s smaller elements.
Final Booklet
Takeaways
I really enjoyed making the booklet. The process involved a lot more than just designing a few pages with image and type; having to write the copy and then curate images that I used made everything much more intimate. This caused me to be a lot more critical about the way I structured the information, causing me to print several versions of my booklet in order to see if the flow of content, information and visuals, was making sense to me. I noticed how different the booklet felt as a sequence of pages when printed vs. a set of rectangles laid out on my screen. The physicality of flipping the page to expose the contents on the next spread is much more impactful than scrolling down a bit to the next rectangle in my flatplan.
On a similar thread, I got so much practice with composition and scale, especially within the spreads in relation to one another. Being that I wanted to create more of an editorial/fashion magazine look, I realized that I would either make super minimalistic or extra bold and loud designs, or maybe even a combination of both. I definitely lacked the balance between those two editorial styles in the earlier stages of the booklet. I was constantly using big type and big imagery but when flipping through several pages of similar content, it gets repetitive and less impactful each time. The introduction of smaller elements scattered throughout the sequence of my booklet helped me to slow down the reading pace and allow the reader to get a true micro-macro viewpoint of Kawakubo’s work.
In addition to the new nature of the project itself, I felt different during the process as well. This might have a lot to do with the way I structured my workflow. For some reason, I got a huge bulk of the ideation process in the beginning with detailed flatplan sketches and then being able to quickly digitalize most of them within the first week. This process truly taught me how difficult ideation is (of course I always knew this but the feeling of comfort and security throughout this project was so highly contrasted from the stress and rush that I usually experience).
PART 3: MOBILE EXPERIENCE
This mobile experience project seems like it will be interesting because we are supposed to translate our booklet into a digital interface. I think that it will be interesting to think about how the user moves through the mobile experience and how that can relate back to the experience of flipping through a booklet while thinking about what the digitalized format might (dis)allow in comparison.
Sitemap + Information Architecture
I’m beginning this process by laying out the information architecture of my experience. We went over this in Lab, talking about how we want the users to travel through the mobile experience; this can be heavily influenced by the way we structure the experience.
Questions to think about:
- Is the experience linear? Or are each of the parts completely distinct?
- How much of the experience is user-driven or guided? It’ll be important to balance the agency of the user vs. nudges that I can provide to help frame the experience.
- How do I plan on introducing navigation? What means are provided for the user and are they clear or a bit more discreet?
- What system of visual assets and interaction patterns will I implement? There should be a level of consistency that will help drive the user’s experience but at the same time, enough surprise that excites them.
As I began working through these questions, I decided that firstly, I want my experience to be linear in nature but completely navigable.
As I began working through these questions, I decided that firstly, I want my experience to be linear in nature but completely navigable.
This structure was highly influenced by my booklet and the (somewhat) linear experience of reading.
Wireframing+ Working in Figma
Thankfully I have some experience working in Figma so this didn’t scare me as much! I was able to put together a quick prototype of a possible onboarding experience.
(Although I didn’t end using this design, I did incorporate the glowing/pulsating asterisk in addition to a clean and minimal color palette.)
Smart-Animate is My Best Friend
One of the bigger ‘challenges while building this mobile experience was the problem solving aspect. Figma is not an animation program and you can only do so much with the built in features. However, in the process of trying to create animations and/or transitions, I started to approach it with a problem-solving attitude, thinking about what I would have to set up in a previous frame in order to execute my ideas.
This process ended up being pretty fun, kind of like a puzzle in a way. The problem-solving paired with the parameters and limitations of Figma helped me to think of more creative and clever ways of bringing my concepts into a refined product.
Interactions + Signifiers
Within the Kawakubo Set
Even though I wasn’t necessarily trying to make my mobile experience a replica of either my booklet or poster, I felt it necessary to make it somewhat visually cohesive. I tried to achieve this through both interactivity and visual design choices.
Final Prototype Demonstration
Takeaways
- This was a fun challenge!
- Made me think about the limitations and affordances of both print and digital mediums.
- Taught me the importance of crafting a strong and cohesive design (visual and interaction based) system. Allows for the making process to be much more streamlined and efficient.
PART 4: TEASER VIDEO
Storyboarding
Audio
After some basic storyboarding, I wanted to explore the different approaches for audio.
Balancing Voiceover + Music
- Here is a playlist with all my audio tracks/versions.
Video
One of my biggest concerns for this video is being able to include Kawakubo’s work and include visual representations of her artifacts. However, most of her work has only been documented through video footage or photos. Being that Kawakubo designs clothing, I’m not sure that I can illustrate or recreate her work. I feel like it would have to be done super tastefully but even then I don’t think that trying to replicate her work would be the best. Most likely, I’ll end up combining vector motion graphics with raw video footage that I might be able to manipulate in some way.
Finding Footage
This is where I feel super stumped. There isn’t as much existing documentation of her work as I thought there would be. Or at least, the type of documentation that I thought there would be. Tons of photos of her work exists from super basic commercial photography to artistic, high-fashion photoshoots; I thought this would be the case for videos as well.
Iterating in After Effects
Final Video
Takeaways
All in all, this was a super hard project which I did not expect. For C-Mini, the video project was the easiest for me and I thought it would go similarly for this semester. But was I wrong.
FINAL SHOWCASE
PART 5: RESPONSIVE WEB EXPERIENCE
Wireframes + Information Architecture
