For my final project in Visual Design I put all of the concepts I have learned in the past few weeks to create a brochure for Fern’s Meadow, my family’s farm. I was especially excited to create this since my family could print and use them once the farmer’s markets begin again.

Before I began to work on my design, I re-read the chapter on The Grid & Brochure Design in Robin Landa’s Graphic Design Solutions. Brochures, according to Landa, are excellent devices for a brand because “In a few pages, with text and images, you can tell a brand story, convey information or instructions, or display products” (170). I knew that this would be the perfect opportunity for me to combine the images I have taken over that last few years with information that could have a customer understand everything we do.

Later in the chapter, Landa lists a few considerations as you are planning your design:

1. “How the brochure system will work with the existing visual system”: Last week I had re-designed the website using two font families, certain colors (well, mostly just green), and assets that the brand already has.
2. “What type of content”: I knew that I wanted this brochure to include information about our story and what products we sell. This was the moment when I made up my mind what the six columns would include: (1) name, contact info, and tagline, (2) our story, (3) our artisan products, (4) our soap, (5) our animals, and (6) how to contact us.
3. “How to communicate the content”: For each column and within the entire brochure I needed to plan out how I wanted the reader’s eyes to travel from one element to the next using visual hierarchies. I knew that the first column and the last column needed to stand out from the rest, as they were the most important for the reader, much like the content “above the fold” on a webpage (Kolowhich Cox). The rest of the content should be uniform with each other, but still have some variation to keep the viewer interested.

Next, I sketched out a draft of the content I wanted to add for each column and copied it to a blank piece of paper so that I could be sure the order of the columns was correct for a tri-fold format.

After that I began to organize my images and assets then watched a tutorial on how to create a brochure in InDesign. By using the correct layout I would be sure that the margins were properly aligned so it prints normally. This is how it turned out!

For the entire brochure I decided to so with green an beige as the primary color since green elicits soothing and natural feelings and implies environmental friendliness and sustainability in a brand (Baker). I chose the beige since it works well as a neutral secondary color to make the other colors and elements pop (Cao).

The cover fold has the most important information: The name, logo, tagline, phone number, and website. I also included a sweet and compelling image of two of our mama goats and a kid. Since the image included a lot of green, I used a small black border so that it didn’t blend in with the background color (Golombisky). The name and logo are the largest elements in the entire brochure since out of anything, that is what I want the readers to understand and remember.

The backside of the brochure is simple, but important. The type on this column is large as well so that it can also be easily seen. I used the Facebook and Instagram logos from their business toolkit and created my own little email logo.

The next column (the first one going left to right) is the first fold that the reader will see when they open the tri-fold. This is where I put the text explaining the story and overview of the brand, along with photos of us as a family at markets and fairs. I also added our goal in bold and italic, setting it out from the rest of the text so that if anyone just wants to skim that fold they get the most important part. In this fold I also “broke the grid” by wrapping the text around two of the photos to “liven up” the panel (Creger).

For each of the inner-panel columns I used the same typeface as I had for the “Our Story” panel – a bold serif font for the title and a sleek sans-serif font for the body content. I wanted to make the two contrast each other as much as I could so that it stood out instead of mushing together (Lupton). I also used a line to separate the contents from the title to make them stand out even more.

For first panel I “broke the grid” again by both wrapping the text a bit and overlapping the images (Creger). For the middle panel I added a customer testimonial to add credibility to our brand (Kolowich Cox). For the last panel I chose the cutest images I could and made simple, but compelling pattern with the text. Since these columns would all be viewed at once I strived for balance and rhythm across all of the panels.

While this brochure will not print out correctly on an everyday office printer due to the margins that most printers have, it will be no problem for a printing company. I am excited to see my creation being read by our customers!

While this is my last post about Visual Design, follow me to keep up with my creative projects. Next I will be working on creating a killer portfolio and doing audio and video productions.

---

_{^{Baker, Justin. The Ultimate UX Guide to Color Design. Medium, 4 Dec 2017, https://medium.muz.li/the-ultimate-ux-guide-to-color-design-4d0a18a706ed.
Cao, Jerry. “Web design color theory: how to create the right emotions with color in web design.” The Next Web, 7 April 2015, https://thenextweb.com/dd/2015/04/07/how-to-create-the-right-emotions-with-color-in-web-design/. Accessed 4 Sept. 2020.
Creger, Rebecca. 11 techniques for breaking the typographic grid. 99designs, 2014, https://99designs.com/blog/tips/11-techniques-for-breaking-the-typographic-grid/. Accessed 10 March 2021.
Golombisky, Kim & Rebecca Hagen. White Space is Not Your Enemy: A Beginner’s Guide to Communicating Visually Through Graphic, Web & Multimedia Design. Baton Rouge, Taylor & Francis Group, 2017.
Kolowich Cox, Lindsay. “The Anatomy of a Winning Website Design [Infographic].” hubspot, https://blog.hubspot.com/marketing/anatomy-web-design. Accessed 3 Feb 2021.
Landa, Robin. Graphic Design Solutions. 6th ed., Cengage, 2019.
Lupton, Ellen. Thinking With Type. Ellen Lupton, 2009, http://thinkingwithtype.com/. Accessed 11 Feb. 2021.
T, Joseph. Create a brochure. Adobe, 30 May 2018, https://helpx.adobe.com/indesign/how-to/make-brochure.html. Accessed 10 March 2021.}}

This week I took a look at how visual design is incorporated in web pages and mobile design. In order to demonstrate the most important concepts, I created a re-design of my family farm’s web homepage on both desktop and mobile.

Desktop Site Re-Design

Before I knew what I wanted to do to change the site, I first did an audit of what fernsmeadow.com looks like currently. While it is not awful, there are several fundamental rules that could be capitalized on.

First of all, the header is rather bland and does not include all of the contact information a person may want. Some of the navigation keywords could be condensed for clarity too. What is the worst about this current homepage is that the above fold barley gives any information about what Fern’s Meadow is when the most important information should be in the above fold (Landa). This is troubling, considering that 77% of web users do not scroll down a page (Kolowich Cox).

When you scroll down, there is another mediocre image (my eyes are closed, for crying out loud!) with a large block of text that can easily be condensed so that a first-time visitor can get the gist quickly. Below that is a misplaced “About Us” header then photos of goats, garlic, and artisan goods with buttons to the corresponding pages.

Looking at this site, it is clear that it was designed canvas-in rather than content-out (Landa). The images and typography do not stand out or particularly compliment each other and the images themselves definitely need to be updated for quality and information.

For my re-design I first planned what content and calls-to-action needed to be established. Then I began with the most important content at the top of the page, with the tagline and abridged “about” section below. The images I chose conveyed the four things that embody the brand: family, produce, artisan goods, and goats – all taken with my higher-quality camera.

The header also received some changes – I moved the contact info to the right to add balance to the grid and added the email so that everything was there at-a-glance for any potential customers. I also changed the font so that it was one of two – in this case, it was the serif font that stands out more. The same goes for the tagline – I kept it in a larger, bolder serif font and had the additional information in an easy-to-read contrasting sans serif. The navigation bar was altered slightly as well – I created two lines to group the page keywords so that it stood out more to the user.

For the under-fold section of the homepage I added another on-brand image and some customer testimonials taken from our Facebook reviews to add credibility. After all, “72% of consumers say positive reviews make them trust a business more” (Kolowich Cox). Finally I re-designed the footer to also include the contact information again along with the already present contact info (Landa).

Mobile Site Re-Design

In today’s world the mobile site is just as, in not more, important as the desktop site. To do the re-design I went through the same process of auditing the current site.

Again, there is a lot of wasted space on the above-fold and the mistakes from the desktop site are almost identical to those on the mobile.

On the mobile site the bulkiness of that text is only amplified. I doubt that many consumers would want to scroll through a minute of reading when the attention span of humans is nearing that of a goldfish. This is on my Galaxy Note9 as well, a phone that has a taller aspect ratio than most.

For the re-design I began with the header and the navigation. I wanted the navigation to have a similar style to that of the desktop site – simple and easy to, well, navigate. Right under the header I created a “MENU” text between two lines to make it its own group. When the user clicks on it, this navigation menu will appear. Again I used the same simplified keywords for clarity.

For the above-fold of the mobile site, I again used an on-brand image and the tagline with abridged info. depending on the screen size, the text would expand or shrink for readability (something that would have to be included in responsive coding). The image would also be a sliding gallery that includes the two other images I selected that are featured on the desktop site.

For the under-fold I had another on-brand image and the customer testimonials again. On the bottom I also included the icons that would link to our various social media sites – something that is even more relevant on mobile as well.

To get a full picture of the mobile re-deign, see the image below.

I would love to implement these design changes into the live site as soon as I can, although there will likely be some minor changes since I will be working with a CMS. Next week I will be creating a tri-fold brochure for Fern’s Meadow that will implement all of the design principles I have learned so far, so stay tuned!

---

_{^{Kolowich Cox, Lindsay. “The Anatomy of a Winning Website Design [Infographic].” hubspot, https://blog.hubspot.com/marketing/anatomy-web-design. Accessed 3 Feb 2021.
Landa, Robin. Graphic Design Solutions. 6th ed., Cengage, 2019.
Lynch, Patrick J. & Sarah Horton. Web Style Guide. 3rd ed., Lynch and Horton, 2017, https://www.webstyleguide.com/wsg3/.}}

This week I explored the branding and visual identity section of visual design and took the opportunity to re-vamp the logo for the organization I am interning with, [with]media.

The Logo

After reading the chapter “Branding and Visual Identity” in Robin Landa’s Graphic Design Solutions, I knew that the logo had to be identifiable, flexible, and accessible. I decided to go with a logotype for the main logo and a lettermark for things like thumbnails and profile pictures.

Naturally, type would be extremely important. I chose to have two distinct typefaces, as Ellen Lupton’s webpage Thinking With Type suggests, I want to “strive for contrast rather than harmony, looking for emphatic differences rather than mushy transitions.”

I chose a nice serif font for the [with] portion of the logotype since I wanted it to be inviting, yet formal. Then I had to adjust some of the kerning to make it optical, which is best for headlines (Lupton). For the MEDIA part of the logotype I chose to go with a bold and uniform sans serif for a more modern feel. This “MEDIA” will change to “TV”, “NEWS”, or “RADIO”, depending on which channel of the company it is.

I also wanted to have a smaller logotype for a profile picture or icon. This is with the [with] compressed into a single w, still keeping the brackets to imply a sort of cohesiveness or community.

While it is simple, I decided to go with a white on black color scheme to keep in line with my main three objectives. I want the name of the company, along with the unique way [with] is grouped together, to be identifiable in the simplest form so that it could be identifiable in many other forms, like the variations below. This way, the [with]media logo can be recognizable and uniform across its many variations.

Also, a huge goal of the company is to promote accessibility, so I wanted to be sure that the logo is as accessible as possible. While the color variations will not be accessible to every seeing person, the white on black is as clear as possible and uniform across most color blindnesses.

The Advertisement

According to Landa, every advertisement seeks to inform, persuade, promote, provoke, or motivate the audience to support a cause or purchase a brand. Since [with]media is a an up and coming brand, I wanted to lean towards the inform and promote aspects to get into the viewer’s mind what [with]media is.

I brainstormed the content of the ad by playing with different phrases that include the word [with] in it. After I shared some initial concepts with my supervisor and the founder of the company, we landed on these final five.

The typical elements of an ad include the headline, body copy, tagline, and signoff. I played around with different ways of mixing around these elements, but ultimately stuck to a fairly simple design. I even decided to get rid of the tagline “for people with disabilities…and everyone else” since I felt that the poster already gave off that information (and any more at this point would be an information overload). What is most important is the the [with] stands out in the hierarchy, since it is the [with] that sets this brand apart.

I am happy with how it turned out, since it establishes a connection to what the brand is (since there isn’t a prior connection) and it clearly states what sets this media company apart form the rest. In the future, I hope to design more ads that target the emotional benefits, but like I said I wanted to drill in what the brand is first.

Bonus Animated Logo!

Since I already had the Illustrator files ready, I decided to make a little animation to the logotype to give it a little more life. I was inspired by example #20 of the article 40 Creative and Memorable Logo Designs to Inspire You. Here is the GIF that I ended up with after reviewing how to use AfterEffects again. While it’s not much, I think it is a nice simple way to open some of our first video pieces.

---

_{^{Landa, Robin. Graphic Design Solutions. 6th ed., Cengage, 2019.
Thinking With Type. Ellen Lupton, 2009, http://thinkingwithtype.com/. Accessed 11 Feb. 2021.
Darling, Kayla. “40 Creative and Memorable Logo Designs to Inspire You.” Visme, Easy WebContent, Inc., https://visme.co/blog/logo-samples/. Accessed 25 Feb. 2021.}}

For this week’s continued practice in the visual design, I explored color theory and color schemes. I would create my own rendition of Milton Glaser’s famous poster of Bob Dylan by using the silhouette (the outline of an object) of a person I admire and adding opaque, spontaneous color via the abstractified hair.

For the portrait I decided to feature my favorite musician (and probable future queen of Mars) Grimes. She immediately came to mind for this project because I appreciate all of the art that she creates, and her use of color being a large contributor to her talent. Each of these color palettes is based on a look or album cover – all of which fit into certain color schemes.

First is the palette based on the hairstyle I chose to capture for this composition. I was able to extract the colors into an easy-to-use palette by using the Colrd image DNA tool.

This palette is an example of a split-complementary color scheme – a mixture of three colors (and their slight variants) that are made of adjacent colors on the color wheel. While a fully complimentary palette would be more dramatic, this combination is still visually intense.

This next palette was based on her album cover for Halafaxa. All of these colors are part of the cool color scheme, occupying the side of the color wheel that includes blue, green, and violet. Cool color schemes are more calm and serene than their warm counterpart. In this particular composition, that calmness presents as a sort of ethereal-galaxy type vibe – something that matches the music of this album very well.

Finally, I created a rendition using the triadic primary color scheme that is based on her album cover for Art Angels. This is definitely the most vibrant of the batch (again, much like the contents of the album itself). The red, blue, and yellow combo is bold, yet playful and may actually be my favorite.

This exercise was a fun way to practice both Adobe Illustrator and color theory while showing appreciation for an artist that inspires me to go out of my comfort zone to be as creative as possible.

---

_{^{Landa, Robin. Graphic Design Solutions. 6th ed., Cengage, 2019.}}

In an attempt to combine the knowledge I have gained so far on the principles of composition, I created a movie poster for an upcoming short documentary that I am creating. While the final poster appears basic, there are many aspects of design that I considered during its creation – much more than the rule of thirds and dimensions.

Conceptual Development

First and foremost, I had to ask myself some essential questions to design the poster. First – what is this poster’s purpose? I knew that I want to grab the viewer’s attention while forming some sort of emotional connection to Elaine, the subject of the film.

Next – how can I make the message resonate with the audience? The message of the film is that despite her hardships and trauma, Elaine was able to still conquer and be proud of who she is.

Both of these issues were addressed by my choice of image. I watched through footage that I filmed and found the perfect still of Elaine looking over the state’s capital building when she was attending sit-in for the clean-slate bill – in this moment, reminiscing about how many times she had been there to make change. This information is not known to the viewer of the poster, of course, but the emotion of accomplishment, pride, and reflection are all apparent.

Basic Considerations for Posters

Some major points for me to incorporate that should be considerations for any poster design (based on the chapter Posters from Robin Landa’s Graphic Design Solutions) are as follows:

Start with content you need to include. This is straightforward for this project – Elaine, the title, and my name. As I said earlier, I began with the most important element of all – a captivating image of the subject to draw the viewer in.

Image to type relationship (size). Since the image is the main element of the design, I did not want the text to compete for attention. Instead, I chose a nice, modern sans-serif in a small enough font so that it would be no more than complimentary.

Entry point. The viewers should know where to start the movement of their eyes so there is no confusion and therefore, a lesser chance of lost attention. The entry point for this composition is marked by contrast in color and size – Elaine is the darkest, most complex figure in the design so the eyes begin there, then follow her gaze up to the title.

Content-led thinking. I began this poster with the documentary in mind and continued this content-based vision throughout its design. Every element connects back to her story and the film, while maintaining a complete composition.

Color

There are two major uses of color in this composition – the combination of colors that created Elaine’s figure and the cool-green background that makes up the ground. First is the consideration of cool v. warm colors. Cool colors typically take the background and warm colors take the foreground, so I knew that I wanted the background to be cool so it does not compete with Elaine, who is supposed to be the most dominant figure in the composition.

Next is the consideration of emotion. Cool colors in general are considered to be calm and serene, but green is especially soothing. Elaine’s expression is once of calm strength – something that I believe is complimented nicely by the teal. A nice plus is that it makes her green eyes pop (and every photographer and videographer knows that the eyes are the gateway to the soul).

Hierarchy and Depth

Along with the contrast in size from the different elements, the texture, shape, and color difference between the figure of Elaine, title, and subtitles imply a clear dominancy hierarchy. This is the same hierarchy that tells the viewers where the entry point and path to continue their gaze lies.

There is also a bit of depth implied by the slight cast shadow around Elaine’s figure and the depth of field within her figure.

Type

For this composition I chose to use two type families – making sure that I was contrasting them enough to make a compelling and non-“mushy” design (Lupton). Each section of text has a distinct, yet overall harmonious, feel.

While it is not the busiest design, I believe that it captures exactly what I wanted it to. Simplicity and restraint when designing is just as important as anything else – if not more – so I knew that as long as I continued to lead my design with a content-based perspective and followed the basic design principles, it would turn out fine.

---

_{^{Baker, Justin. The Ultimate UX Guide to Color Design. Medium, 4 Dec 2017, https://medium.muz.li/the-ultimate-ux-guide-to-color-design-4d0a18a706ed.
Callahan, Ewa. “Depth Perception.” Visual Design, 25 Jan. 2021. Quinnipiac University.Lecture Recording.
Fontana, Anthony. “2D Foundations: Intro to Composition.”  Bowling Green State University.Microsoft PowerPointpresentation.
Landa, Robin. Graphic Design Solutions. 6th ed., Cengage, 2019.
Thinking With Type. Ellen Lupton, 2009, http://thinkingwithtype.com/. Accessed 11 Feb. 2021.}}

For this week’s exploration of visual design I studied typography. There is so much depth to how text is presented that many – myself included, until now – take for granted. For example, there are many terms for the anatomy of a letter, as explored in this diagram from Thinking With Type:

Beyond the specific terms of each part of an induvial letter, there are also terms for how characters interact with each other. Kerning is the spacing between two characters which makes sure that characters flow from one to the next with optimal readability.

Leading, like kerning, is a type of spacing. It is the amount of space from one baseline to the next. As you can see from the image below, it is important to adjust the line spacing when integrating different fonts and point sizes.

There is also a rich history of type classifications. According to Robin Landa’s Graphic Design Solutions the main classifications include Old Style (roman with angled/bracketed serifs), Transitional (with less defined serifs), and Modern (smaller serifs, more geometric, with a larger contrast between thick and thin strokes). Along with these there is also slab serif, sans serif, blackletter, script, and display.

After getting an understanding of the fundamentals of typography, it was time for me to give it a go. I chose one word to design in a meaningful way. I chose “Organization” – as both a noun and a verb – since this week I began an internship which has made me motivated to get organized as I join a new organization.

The elements that I most wanted to incorporate were a tight kerning and a suitable type. The type classification for this would be a modern, geometric sans-serif. When one thinks of the word “organization” it is something that is structured in some way – there is no need for serifs or other unnecessary adornments when productivity and efficiency is involved.

At the same time, organizations are fluid and each character within an organization takes on a different position while still being tightly knit into a cohesive team. To get this element of the word into the type I manipulated the points (in Adobe Illustrator) to form around the other characters and be their own unique part of the whole, which allowed me to make the kerning super tight.

The maximum cap height of all of the characters is the same, but I decided to have the O also reach beyond the baseline like a descender would (like the g does). I wanted to do this to represent an organization’s leader – someone who is an all-encompassing character. However, they are not as integrated with the rest of the organization – while all of the other characters are woven together, the O stands alone, leading the group.

Another element that I wanted to be sure to incorporate is the roundness of the counters (the space enclosed by the strokes of a letter). The contrast of the roundness mixes with the straight, sharp lines adds a bit of bubbliness and a lighter emotion. The “direction”, of path the eye takes to follow the word, is also dynamic and creative – much like an organization should be.

While I am sure I could do more if I had more practice in Illustrator, I think that the simplicity of the type I created works well. This is a creative exercise I would love to do again in the future when I am inspired by another word.

---

^{_{Landa, Robin. Graphic Design Solutions. 6th ed., Cengage, 2019.
Thinking With Type. Ellen Lupton, 2009, http://thinkingwithtype.com/. Accessed 11 Feb. 2021.}}

Before creating a story from many different images, I wanted to plan what kind of emotion I wanted to capture – after all, emotion is just as important as information and function. For what I had in mind somewhere right between fear and surprise on Pultchik’s Wheel of Emotions would be just right – awe is what I would keep in mind while creating my composition.

After going through some images I captured over the Summer, I came up with the most awe-inspiring tale I could think of with the material I had: the “Attack of the Killer Kids”.

For this composition I knew that I wanted to showcase a few key elements when it comes to the illusion of spatial depth. First of all, I wanted to focus on using fore, middle, and background. In Chapter 7 of Robin Landa’s Graphic Design Solutions, the foreground is supposed to be bigger, brighter, and have more contrast and detail. While I followed the guideline of a bigger foreground, the brighter, more detailed part of the image is the middle ground.

I chose to have the middle ground be the area of focus by using an aerial perspective. While the human eye usually sees closer objects to be more clear, the depth of field is still limited (much like a camera). I wanted to bring focus to the person about to be attacked by the white goat – this was the area of the image that was clearest and brightest.

In addition to this, the area that is most in-focus (or the least blurred) lies right around the path of the Golden Mean. The eye begins with the largest objects in the image (the dead bodies about to be consumed in the foreground) and ends up where the innocent hikers are about to perish.

With the Golden Ratio also comes balance. Even though this image is far from symmetrical, I can still balance the visual weight; while there are more objects on the left side of the composition, the size of the elements on the right add more visual weight, making them about even.

I used a total of nine images to create this composition. As you may notice, some of the elements I selected from these images were already blurry, so I used that to my advantage. For the ones that were not (like the base image of my friend and husband pretending to fall of Sleeping Giant) I used the blur tool in Photoshop to make the illusion of a smaller depth of field. To make the shadows match that base image I also had to play with basic adjustments of contrast and brightness.

Even though having the limitation of using images that I had already captured may have seemed difficult at first, I found that it opened me up to make a more creative story than I thought was possible. Trying to find associations between seemingly unrelated images is a useful creative tool that I will think about using again if I ever feel stumped.

---

_{^{Callahan, Ewa. “Depth Perception.” Visual Design, 25 Jan. 2021. Quinnipiac University. Lecture Recording.
Callahan, Ewa. “Design as Communication.” Visual Design,  1 Feb. 2021. Quinnipiac University. Lecture Recording.
Fontana, Anthony. “2D Foundations: Intro to Composition.”  Bowling Green State University. Microsoft PowerPoint presentation.
Landa, Robin. Graphic Design Solutions. 6th ed., Cengage, 2019.}}

For my first venture into the world of visual design, I created a piece of abstract art inspired by a series of paintings created by another artist. After some discussion with my friend who appreciated abstract paintings, he suggested that I check out the work of Simon C Page, a British graphic designer and illustrator.

While browsing through his work, the series “Grunge Geometry”, which can be viewed on Page’s art prints shop, stood out to me. Before taking a try of creating my own composition based on his style, I analyzed each of the pieces below, keeping the basics of graphic design in mind.

The first of the series starts with a geometric bang. This composition is made of many randomly-colored curved lines and a ground that is a light beige. The curved lines do not touch, but due to the Gestalt Principle of continuity (Callahan), the human brain perceives the four curved lines that are just barley separated to be touching in order to make a full circle.

The next in the series that caught my eye was “Grunge Geometry D”. This one is vastly different from the previous since it is asymmetrical. According to Anthony Fontana’s presentation on 2-D Foundations, an asymmetric balance in a composition, unlike a symmetric one, will bring movement and dynamic qualities to the image. There are also elements of hierarchy – the larger hexagons are more dominant than the smaller ones near the center of the image (Fontana). This could also imply that the larger hexagons are closer to us than the further ones, giving a feel of fore, middle, and background. Looking at it this way makes it seem like the viewer is positioned in between two waterfalls of colorful hexagons (although it is a bit of a stretch – still abstract art is there to make you think)!

“E”, again, is different from the rest. If it were not for the colors the symmetry of the piece would make it static, but the gradient from orange to pink to purple to many shades of blue makes for a dynamic and compelling piece. In addition, the different colors of the triangles create the illusion of a form shadow on the shapes (Callahan), making the point where four triangles meet appear as if it were closer like a bunch of little pyramids poking up at the viewer.

“G” is very eye-catching. The color palette, randomization of color, and presence of many shapes is similar to the rest of the group, but the way the curved rectangles are larger on the outside and get smaller as they go in makes the piece very dynamic. This composition uses the depth perception cue of linear perspective – the bigger shapes appear closer to the viewer and the smaller ones appear very distant (Callahan). It is as if it is a colorful tunnel that the viewer is peering down.

“J” is my favorite of the collection since it seems so simple at first glance, but is actually quite complex. Page used only 2 types of shapes – a diamond and a hexagon – to create this entire image. The lines (which I would consider a sort of white space/ground as it is the same color as the border around the figures) are all parts of the shapes – one long hexagon, one regular hexagon, and a large diamond in the middle with a smaller diamond on either side.

This one is much like “J” but only has large hexagons overlapping each other, creating random polygons in the process. While the idea of that sounds boring, I believe that the unity of the piece makes it all come together very nicely; the repetition in the hexagons, the satisfying configuration which leaves no space odd or unaccounted for, and the variety that the randomly selected colors from the palette bring (Landa).

The final piece I reviewed stumped me more than the rest – From what I could gather Page was using lines to create triangles within triangles within triangles until two small triangles overlapped into a shape resembling the Star of David. For this choice of shape I agree with Rune Madsen in his article “Basic Shapes and Relationships” – the triangle is still basic, but brings a lot of edge and movement into the piece. That combined with the huge variety in color from shape to shape (while sticking to a somewhat limited palette) take the eyes for a rollercoaster.

For my own piece I based the color palette mostly on J, K, and M but did my best to keep the spirit of symmetry and continuity that is present in the majority of the series intact. I was also drawn to the thin, but vital, whitespace that those three utilized.

I wanted to do the same idea as “J” where I use two shapes (of varying sizes) to create a composition, and I think it worked well. I began with stretched hexagons then overlapped them vertically to make a new super thin hexagon. After adding more rows, I overlapped them again horizontally to create medium-sized diamonds within the figures and a small diamond where there was a bit of “ground” (which became a figure when I colored it in and made it its own shape). Finally, I added larger diamonds on top of every other horizontal hexagon, which I feel added a little more variety to the image.

Next, I used the eyedrop tool in Photoshop to select colors from the palettes that were used in J, K, and M. Since I was using the fill tool to do this and not an actual paintbrush I added a bit of variety to the value of the colors for some texture.

After I had the fully colored shapes and lines, I used the brush tool (while holding shift to keep it straight) to create the border, then the blend tool to add the brush-like strokes near the inner edges like in the original paintings.

Finally, I needed to emulate the cloud-like texture that is present in the original pieces. To do this I used the same brush as the border, lowered the opacity, scribbled in the center of the canvas, then blended it like crazy with the finger smudge tool.

In time I hope to be able to create pieces more complex than this – one that is asymmetrical and with more movement perhaps – but for my first piece, I am happy with it. Follow my blog to keep updated in my pursuit to know more about visual design and the pieces I make to practice those concepts along the way!

---

Sources:

^{_{Callahan, Ewa. “Depth Perception.” Visual Design, 25 Jan. 2021. Quinnipiac University. Lecture Recording.
Fontana, Anthony. “2D Foundations: Intro to Composition.”  Bowling Green State University. Microsoft PowerPoint presentation.
Landa, Robin. Graphic Design Solutions. 6th ed., Cengage, 2019.
Madsen, Rune. “Basic Shapes and Relationships.” Programming Design Systems, http://printingcode.runemadsen.com/lecture-form/. Accessed 27 Jan. 2021.}}