The event I got is the ReelAbilities Film Festival. Based on the info on the official site, it is the largest festival in the US dedicated people with different disabilities. Southside Work is one among many locations all around the world that host the festival. However, I didn’t find much live photos or videos thta can show the overall mood (feel) thta the event can bring to the audience. And I wonder who the targeted audiences. Is it exclusively for people facing disabilities? Or is it more opened to the public? To get a first-person experience of the event, I attended the screening on Sep.6th. Here are some notes :
- It’s my first time visiting SouthsideWorks Cinema. It blends well into the relaxing lifestyle around the district. And it feels more ‘local’ compared to larger theaters like AMC. Although, surprisingly I didn’t see any stand or even digital screens showing information about the festival on my way to the ticket desk. And even when I am checking in, I didn’t see huge logos or visual promotions for the event. Only the orange and dark grey color scheme notified me that this is the place.
- A lady in a wheelchair checked me in. She officially works for the festival. Very impressed by how the festival can help disabled people in such a practical way. And this made me feel personally bounded to the event.
- The theater was half-full before the films start. The age range of the audience is extremely diverse: ranging from teenagers to elderlies (which I feel is quite uncommon ). Audiences with disabilities sit at the very front row, some with volunteers accompanying them.
- There was a short reception from one of the lead organizers before the film starts. She coved a brief into to the event and the films we are about to see. According to her, the event has been around for 7 years. Her words are been translated to sign language in real-time.
- No commercial adds seen before the screening. The information presented is felt quite heavy (two screens on left). A related art exhibition kindof adopts the bright orange+grey color scheme.
- Extremely touching and heartwarming film; more like documentaries rather than common ‘movies’ people usually go to theaters to see. Moreover, The producer, Kyle ( has inherited Fraser syndrome o(╥﹏╥))came in to talk to us. The special experience of direct interaction with gene-disease patients will stick with me long after the event.
- Audiences with physical/mental burden actively raised questions during the Q and A session. The festival is also a platform for people with various kinds of disabilities to interact with one another!
Overall, the event feels warming. It also holds significant educational value since I am touched and motivated due to ① their grounded support provided to people with disability (chances to work and social ); ② letting audience directly face lead organizer and film producers made me feel I am a valued special audience. For normal audiences, the event invokes self-reflection and calls for action, hence shall increase society’s inclusiveness.
However, these feelings might be eliminated if the event gets more popular. And I assume if the viewer-size is massive, it would be harder for disabled audiences to participate and be engaged in conversations.
- an expressive phrase or sentence that describes the event: a heart-warming and welcoming event that enables all kinds of people to meet, see (films), interact and provides long-lasting warmth.
- list of words that describe the experience: touched/moved, upon serious issues, be educated, deep empathy, personally involved, directly facing, mixed feeling, long-lasting memory, spontaneous/voluntary participation.
- From the official site:
Through impactful films and engaging programs, this festival brings together the community to explore and celebrate the diversity of our shared human experience. (https://filmpittsburgh.org/pages/about-reelabilities)
Exercise 1–4: font-weight, proximity, and alignment
Although we are only allowed to change very few aspects of the provided text on each poster, we can illustrate the weight (improtance) of information quite clearly. And viewers’ eyes can be guided to where we want them to look at so that they can quickly grasp primary information. In the meantime, the secondary information shall still be readable but competing. Here are some findings/reflection:
The width and positioning of the text box: Longer lines seems hard to read. Fort instance, the lines telling time information became harder to follow in the left composition. I think it’s due to ① the when viewers finish a long line, their gaze locates at the far right from where all lines are aligned. When they want to access the next line, they have to look back to the left side, which makes reading inefficient. Moreover, such a shift might cause one to accidentally skip lines. ② The zigzags created by the negative space around the text is quite distracting. In the next few versions, I made the text box narrower so the times can be broken into 2 or 3 lines. The layout at the right is quite clear in terms of time. but other information seems too fragmented (e.g. producers’ names been broken into multiple lines). I am not sure about the effect of such a continuous narrow column of information, but I personally like this one the most.
When the box is placed at the center of the page, the composition feels static. The content feels formal and heavy. Although the information seems quite boring, such layout emphasized the ‘content is important!’. When the text box is shifted to the up left corner of the margin, the page becomes asymmetrical and more dynamic. I personally think this layout feels nice to look at but is been used so frequently, hence not so interesting/attractive. On the right-hand side, the margin is ignored, and text directly toches the edge of the page. Layout wise it is playful; will definitely capture my attention. However, the readability drops since the strokes of letters might be slightly cutoff. The feel of the page is also inconsistent with the mood of the assigned event. The layout feels fun, playful and alive, white the event actually discusses quite serious issues and invoke deep, long-lasting thoughts.
Combination of font weights: The first pair is obviously problematic. The two weights resemble too much that is hard to tell the information’s hierarchy difference at first glance. Viewers’ can probably detect that there are some differences, but not exactly sure, which prohibits the taking-in of information. The latter two provides a sufficient amount of contrast between stroke. The title of the film is high lighted. I prefer the stronger contrast, but is uncertain about whether such clear distinction had made two content too distinct/separated?
Two flush-left margins vs Three: I am quite satisfied with the compositions with 2 margin widths. I am able to clearly separate text into blocks of information, hence highlight some of them. A question I have is: sometimes I just grouped them, and allow extra white space between groups by tabs. This doesn’t mean I have created ‘hierarchy’ since all the groups seem equally important. Is this a valid approach? or Clarity can only be achieved by building hierarchy? When it comes to 3 margins, the layout seems quite chaotic… There are so many layers of information that I feel it is hard to tell which ones are more significant and which ones are linked together. I tried many different layouts but didn’t figure out a one that is perfectly clear in terms of communicating information.
A similar issue can occur when I skip lines too often (image below, left-hand side). There are too many lines being highlighted that none of them seems important anymore. And the little pieces of information feels fragmented and disconnected (like the ones in 3 margin width, but slightly less chaotic). Also, only use 75 provides a special ‘weight’ to the block of text, allow it to sit firmly on the page. And the content feels serious and important. Again, not sure if it is appropriate to do in professional typography/typesetting, I am more attracted to the page and wants to read the information contained.
Overall it is quite surprising that by simply adding one more weight from the same font family or skip some lines, we can make some text primary, and all others fade a bit. However, sometimes if simple ticks such as indentations, and skip lines is over-played, the text can already become less readable and attractive.
As a class, we reviewed some pieces from exercise 1–3. Interestingly I am drawing to more organized layouts compared to the ones that created interesting negative spaces. For instance, although posters below(they dopop-out and attract attention), I find it hard to follow the content included. There is extra work for my mind to do to classify information and eliminate confusion. Although the viewers do spend more time looking at the poser, I am not sure the experience of figuring-out the information is delightful. On the other hand, the information in posters shall not be too ‘at the face’. I assume if the experience of obtaining information is totally seamless, the graphic will not be remembered by the viewer after they walk away.
Secondly, knowing layouts themselves carry emotion, such a dynamic/ active might not suite ReelAbility. The film festival discussed serious topics and invites people to reflect upon accessibility and inclusiveness issues. Although the event is a ‘celebration’ (as stated by its official site), keywords thta I would attach to the even are ‘self-reflecting, empathy ’, which might not be suitable to be placed in such a dynamic layout
Some key takeaways from the class discussion:
- Not too much and not too little (Not all white spaces need to be filled !).
- Related contents shall be placed closer to one another; disjointed texts suggest readers they are about different things. This should guide spacing between chunks of text, as well as between lines.
- Always do test prints and review them from a further distance.
- Alignment rules shall be applied consistently.
- Modify tabs, space between lines to fit the content and purpose of the piece (CONTEXT driven).
Exercise 5: Scale
Exercise 1– 4 introduced us to build clear hierarchy with font-weight, proximity, and alignment. Considering all these elements, we are now altering point size and color in the 2 following exercises. Vicki suggested that we start doing experiments on paper. This limited the available text sizes in a much narrower range, and limited color choices to the ones occurred in the magazine.
Like the last picture above showed, I paired text in different size and weight together by moving around segmented pieces. After trying out many scale/placement solution, I mounted the ones I think are working well on a letter-size paper and scanned them (see above). Here are some reflections:
- Setting constraints for myself: The poster became unpleasently busy when I use text in three or more sizes. Viewers would have a hard time finding the information that they want. When I work digitally, I am often overwhelmed by infinite numbers of size choices, hence tend to fit many more kinds of stuff on the page than I actually should. Using the cut paper pieces is like setting a boundary for me so that I can keep my solutions simple and powerful, even if there are so many changes I can make. (again, can ≠ should)
- Reviewing designs on screen? I found scale and proximity issues quite easy to identify when working on paper. When I step back or hold the poster vertically against the wall, I can tell if time is too small to be read, or if titles are too big relative to all other components. However, on screens, I am so used to zoom in and zoom out to fit the test size for my eyes. And the shift+W preview presents the poster a smaller scale. I assume the prediction of what actually will cont out of the print depends on experience. Now I’ll frequently do test prints avoid unpleasant surprises.
And here are some thougts regarding exercise 5: ① The hierarchy became really clear in these pieces. Personally, I am more drawn to strong size contrast. If I am the potential audience of the event, when I walk by the poster, I would be drawn to bigger size texts, then easily get access to more detailed information due to relationship between texts crated by proximity. ② Another solution to stress certain information is to leave white spaces around it. I am inspired by this page from an issue of MIT Tech Review in 1961. It immediately attracts attention among many of the text-dense pages ion the magazine. And it created a not so alerting, but effective PAUSE sign in the magazine. These white spaces invite readers to reflect and think, which is what I am trying to make my audiences do. Hence I adopted a similar layout (see after the magazine pages) (truly amazed by the designers’ compelling, remarkable graphics created only with black and white; the page on the right-hand side is an example of dramatic size contrast which I think is very inspirational).
③ And the magazine pages above also reversed the positive and negative space, leaving the text to be white. The darker background is more unusual in everyday life and is more connected to ‘seriousness’. I applied them to all the layouts. The white space one isn’t as powerful as before since now the white spaces have been filled by information (dense black color) again. Others look better in black. Weirdly, they now feel more connected to ‘film’. (Theaters are dim? screens and Photographic film have a similar color scheme? look like credit lists at end of movies?)
Magazine color exercise
We started to think about colors in a similar way. But instead of printing colors out, we looked for colors in magazines. I build a couple of color palettes with cut color pieces that I found in the magazine.
Exercise 6: with one color
I feel it is significant to start by asking myself: what kind of color do I want? I found nice color palates in magazines, and I’ll start with using one additional color. but which color shall I go with?
- Considering my experience and the statement for the event, I don’t want my colors to be high-key and high-energy. Hence I’ll avoid too much highly saturated, bright colors. One used carefully might help to highlight important information. Then I’d better not use the complementary color with similar saturation and brightness. Because such pairing conveys an active, excitement.
- Yet the colors should not be too pale (high-key, tinted, low saturation colors feel peaceful and calm, and is more on the delighted side, see the Monet paintings below). Then the poster is likely to fail to ‘invite reflection upon self’ and will not match the events’ serious and sorrow side.
- Low key colors don’t feel right too. Overall the event is still a celebration and the ‘heartwarming’ feel shall not be neglected. I did a shallow and rough search on ‘healthcare design graphics’, aiming to find some suitable direction to go. And, according to research, Orange and Cyan seem to be the most common. Cyan Feels too clinical, so I’ll go with orange in the next exercise. So this palette will be applied first:
After all these thoughts, here are the ones I liked for exercise 6. I found there are so many ways we can add color. There are infinite ways designers can alter the quality, amount and distribution of color. In the last row, I tried to add a background texture just for fun. However, this leads me some questions: How to avoid generic decorations? What count as decoration? Shall this be defined by viewers or designers?… These are really broad questions, but I’d like to keep them at the back of my mind as I proceed.
Dealing with printing issues
Although Andrew reminded us that colors coming out of printers are very likely going to shift, I am still shocked by the color difference. I worked on posters at home and printed them with my small HP Inkjet printer. The orange and black became desaturated, which is not surprising. But the shift in purple is out of my expectation. I used the eyedropper tool to pick colors from the magazines (so the colors shall be CMYK safe?) and I have set my document in CMYK. Should I get the colors in an alternative way?
I found although the colors are from magazines, the colors have shifted as I scan/photograph them. So Andrew suggested we build the colors in Id/Ai rather than use an eyedropper tool. Also, even if we build the color ourselves it is possible the colors are not achievable in CMYK. If a triangular warning sign shows up in the color window, I’ll have to adjust the color so that it is color is inside of CMYK gamut.
Even if I did not get the warning sign, when I did a test print, the color still shifted, making the content not readable. In order to get the ideal purple efficiently, I did small samples of purples against a black background. I fond this way pretty effective and efficient. The image below showed how big the color shifted when moving from screen to print. The saturation is largely lost, resulting in dull colors. I wonder are there solutions other than adjusting the design itself? Also, I noticed, Macbooks’ auto screen color-temperature adjust is quite annoying; sometimes prohibits me to see colors.
I also noticed printers and papers I use have a huge impact on the print outcome. As showed below. I worked with a couple of different printers to see which one offer the best color output. Additionally, I found the finish quality differs from printer to printer: some are glossy and shiny, while others offer a matt finish. These features have no way to be accurately embodied on screen. Again, this proved the significance of doing test prints.
We looked at the color and scale exercises as a class. Pinning all these posters up allows me to see which ones pop-out and attract attention. Here are some takeaways that I’ll apply in subsequent activities:
- Although there are less and fewer restraints we move forward, it is useful to give ourselves some restrictions. For instance: Use no more than 2 weight and 3 sizes. Such a practice can keep the hierarchy under control.
- Increased font size → increased leading. Overall, the content should drive the kerning, tracking, etc… So we should avoid using the auto spacing in Indesign. Again, these details can make posters feel ‘special’, hence pop-out from others.
- When placing elements on the page, consider readers’ order of accessing information. The flow should be guided by the visual. (the poster above attracts attention by hug titles, but the flow is quite confusing. Readers can easily get lost/ don’t know where to look next, and may find the vertically oriented text hard to read)
- Straight lines and curves create strong visual contrast. This allows circular and organic shapes to be more noticeable compared to geometrical shapes. When the two are used together, an active mood is created. In this case, the background shapes add to the feel of the page, so they are not just decorations.
- Shapes, texture, color, images should all be used to ① enhance visual hierarchy or ② add a specific mood to the piece. These elements should accommodate the layout and solve problems. Mindlessly ‘applying colors and images ’ is not a good practice.
- Be brave about colors. Avoid common straight-on colors.
Class activity: Choosing images
Vicki asked us to each print out an image that could be used in exercise 7 and a peer will try to identify the event through the picture. There are generally three types of images get printed out: photo, illustrations and texture/pattern.
- Photos are pretty common. Some are more abstract. Joseph printout a quite clean and stylized architecture for Arts and lecture. The technical yet elegant feel is conveyed thoroughly. However, viewers might interpret the photo differently, therefore think the lectures are concentrated on archi. Designers should consider ‘do viewers see what I want them to see?’ when choosing images. Mia picked an image with books for the same event, which maintained the same mood, and the literal meaning matches too. I guess in this case the forgiveness of this design is bigger.
- Illustrations and photos can sometimes bee too literal. For instance,m show a saxophone or orthographic profile for musicians might be too literal. Although viewers can immediately get the poster is about Jazz, this approach might be dull (not exciting). So the balance between abstract and literal, specific and general should be carefully controlled.
I have played with patterns in exercise 5. I noticed they can be too abstract that fail to provide audiences the context of the event. While they do communicate mood, different people read patterns in drastically different ways. And patterns could be quite generic. In exercise 7, I’ll be exploring illustrations and photos.
Before searching for images, I tried to apply the pattern to one of my scale exercises. Additionally, the proportion of the poster need to be adjusted (vertically stretched). The outcomes seem okay. Readable information and some texture made a pretty dull piece. Comparing it to the previous version, the impactful white space becomes crowded again. Overall, the pattern approach used on another layout might no be suitable in this case. And due to the change in the size of the paper, the top part is no longer a square, which is not as powerful. The font also seems too small to be accessible.
Image + concept?
We are only allowed to use one picture on the poster. I started by looking at various images that are somewhat connected to disability and theater.
- Firstly, these are all too literal. Illustration adopted a flat design, which is quite commonly used on digital platforms, which I don’t think look as nice if printed at a bigger scale. And the mood might be too light/ relaxed for the event.
- The photo in the middle might be too specific. Viewers may wonder: ‘are the films about this specific patient? ’ Plus the images seem too complex and detail. If text occurs with the images, two visual elements might be competing with one another, resulting in an unpleasantly busy situation. Again, pictures shall not be just thrown on to posters; they should accommodate the layout, enhance the mood and keep the hierarchy clear.
- The third picture lacks the human factor where these should be one. And the wheelchair seems too stereotypical. It is the first thing come to people’s mind when disability is mentioned, but it is not the only disability. Plus, this approach ignored patients with none-visible disabilities (in fact the film I went to see is about brain damage, which is not always visible). I feel such a biased picture didn't communicate the ‘inclusive’ concept of the event.
I switched keywords to ‘accessibility’, looking for more implied imageries that communicate ‘barrier and isolate’. Here are some posters I developed.
I am also interested in this overlapping/double exposure effect. The unfolding of a series of movement in the first image reminded me body movements. To related to accessibility, I think sign languages (changing hand gestures) might be a good approach.
And here are the posters. The gestures in the posers makeup “FILM” in sign langue. In some version, they are used as cropping Ls that guide readers to look at the content. One concern I currently have is what if viewers don't recognize that these are sign languages? Would this prohibit them from understanding the content?
Problems & Plans to solve
We had individual desk crit today. Here are a couple of feedbacks from instructors and peers:
- Since had many iterations for the ‘barrier’ idea, I had a hard time to narrow one down. Vicki mentioned it might be helpful if I put up all posters on a messy/full billboard to see which on pops.
- Hierarchically, the date and director stuck together. I will try to differ the two kinds of information by altering the date part of the text so the ‘when’ information will be easier to access.
- For some pieces, the upper text and lower yellow barrier feel too separated. Also, a metaphor was used in this piece. so by looking at the poster, viewers may not know what the event is actually about. These two problems could be solved by adding a tag line for the event. I have one written at an early stage of the project:
It is a celebration breaks the barrier isolating people with disabilities, brings together the community to explore the human experience.
- Andrew and a few classmates suggested the shadow of the fence and the text feel too harsh and traps too much attention. I agree: Since I am aiming for the projected, and constantly changing feel of films, the title text and shadow could be less solid.
Narrowing down the choices
There are unlimited possibilities for posters, and I can choose only one or two to further refine. I pinned all of them up and looked from a distance. In a relatively unorganized environment, red posters still capture attention, yet feels alerting and tense. Among all my posters, the dark background one feels quite special, and the one’s title stained blue have some harshness that captures my eyes. These two will be the two I’ll be further refining. Although I liked the third piece with a light (almost transparent title ), the title is so muted and lost readability when I move further away. So it might not be a very good choice.
Adjusting the blur/color in title text
In the final version, I made the left side of the title also blurred out, keeping the ‘Abilities’ still highly shared and in-focus. To echo the yellow at the bottom of the composition, I added a flare (flare overlay, layereffect= screen) to slightly warm up the cool blue tone.
Adding the tag-line
Readability issue: The color should be yellow if I want to tile the upper and the lower part of the poster together, which is the intention of adding the line. But the yellow color is slightly hard to read in yellow 55, but the chunk of text feels too heavy when I use yellow 75. I don't want to add another type of weight to the poster, so these are my only choices.
Structure: And this additional block of text feel extra. The original structure of the poster feels neat and tidy. When the additional bit of information is added, this feeling is taken away. The breathing space and the free-flowing texture in the background are also interrupted.
I landed on this solution, but still not fully satisfied with it. The caption was cut shorter to maintain the light-weight feel. The readability issues still existed though. I’ve tried a few kinds of yellow; the current version works the best for the date information at the bottom. And I don't want to end up with slightly different yellows. if I used purple/blue, then the line fail to achieve its original goal… Might not want this line in the final. Maybe I can adjust the title color abit more?
I eliminated the tagline and warmed the tone of the left side of the title. The result is pretty pleasant. So here are the two posters for the final crit on Thursday:
Final feedbacks for the class
- The Jazz group’s posters vary from one another( for me Lanston and Youie’s posters represent Jazz by two distinct ways — one tells excitement and active, another feel delighted and clear). The ‘how much playfulness’ needs to be carefully manipulated. Although sticking to responsible and safe approaches can create a clear visual hierarchy, but the result might lack a ‘special’ point that makes the poster click. Yet, an overworked poster is equally undesirable.
- Vicki pointed out there are no face pictures used in any of the posters. Although using faces might accidentally suggest the event is about an individual, faces are powerful in showing emotion. Many of us (including me, in some past iterations) used human hands. Hands are good at conveying actions (Charmine used hands to create a disclosure of paling musical instruments) and symbols (sign language, gestures). But emotion conveyed through hands can be limited compared to the face. I assume adopt more human elements in posters can help identify indented audiences and make people feel more related to the event.
- Guest speakers elaborated on implied symbolism. The staircases and barriers are examples of nice images choices for their contexts. Metaphors are embedded in graphics. Viewers can feel the event through in-direct links, yet unable to resolve all mysteries at once, therefore would spend longer time looking at the pieces. However, the choice of the image shall not be too generic. For instance, sunset and icebergs are similies been used so common that they are no longer trigger interest.
Final feedbacks for my piece
- White background + big text = stressed the title too much. Competing with the barriers at the bottom.
- background texture too light. To eliminate the pale feel, I’ll enhance the background textures.
- Could be made into a series — layout remains the same, change the foreground object and maybe the spot color.