Tiff Cruz - Producer & Designer
Luna Wu - Designer
Aman Gebre - Art Director
Defne Kaynak - Art Director & Designer
-Establish communication with the client, handle feedback effectively, and create team timelines.
-Organize design assets to hand off to client
-Arrange the design layout of the pages and develop content.
-Build inner pages of website.
The Children’s Art Carnival (CAC) is a non-profit organization based in Harlem that offers visual arts education to young individuals and their families in Hamilton Heights and across New York City. CAC serves as a positive environment for youth, establishing a robust foundation in visual arts and contributing to innovations in the field of education.
Create a website aimed at fostering a robust community for artists. It serves as a space that nurtures the development and growth of participants from early ages through adulthood, offering creative experiences like workshops and events. The goal is to establish a safe haven that supports both current and future artists. Develop a comprehensive website that they can continue to build on.
Stand out in the community.
Reach the primary target audience, which includes young people aged 5 - 18, as well as artists aged 21 and older.
Develop website pages for signing up for primary art-making workshops designed for 12-18 year olds, and professional development workshops tailored for early career artists.Create an informative about page to provide people with more insights into CAC.
Solicit donations to sustain future programs for upcoming generations and to benefit the Harlem community.
Harlem School of Arts
The Drawing Center
Beam Center
Children's Museum of Manhattan
Brownsville
Initiate the moodboarding process in accordance with their core values. From these boards, we have proceeded to create lo-fi sketches for the homepage, gradually evolving into hi-fi sketches. In our initial pitch, we will showcase diverse art concepts for CAC, encompassing the inspiration board, color palette, typography, and an in-depth exploration of how their values have influenced our design decisions.
Empowering
Creative
Easy
Educational
Lighthearted
Once an art direction was approved, we began mapping out the site structure. From the initial pitch, we actively sought feedback to identify the most important features that the client wished to emphasize on both the homepage and inner pages, particularly in terms of site map.
- Two separate pages for events and workshops. The workshop page would allow users to read workshop descriptions, sign up, learn more about the hosting artist, and find contact information. The event page would include event descriptions and sign-up details, with access to the number of attendees.
- Pages such as Homepage, Events, Workshops, Donation, and About were decided upon initially.
- They later added the Contact and Membership page during our iteration stage of the homepage.
Additionally, we compiled a style guide and library based on client feedback and visual assets. This involved establishing typographic styles for headings, subheadings, and body text, creating a color palette, defining CTA button styles, and refining the illustration style.
Our primary goal for the first day was to finalize the homepage, providing a foundation for the inner pages and incorporating new photography provided during the initial round. We prioritized overall layout, establishing a strong visual hierarchy with attention to spacing and leading, and ensuring a cohesive illustration style as we textured our shapes.
Striking a balance in the treatment of illustrations prevents visual dissonance and establishes a coherent design language. Mindful cropping of images, learned from initial iterations, prevents overpowering of text, maintaining an equilibrium between visual appeal and content clarity. Through multiple iterations, we tried to tackle effective section division without overwhelming color schemes contributes to a balanced visual hierarchy, enhancing user navigation and comprehension.
We considered the strategic use of hover interactions and also how this would later affect the inner pages. One such interaction on our homepage in particular of using shapes in the Support Us section as a hover over to show different photographs of children working on art. These interactions should enhance user engagement without overshadowing essential content.
We also thought about how to layout our different folds such as an accurate interpretation of Workshop and Event pages so that we ensures a seamless narrative, guiding users through the diverse offerings. We also had to take in account on the limitations of EditorX which was our site builder.
Lastly, spacing out folds on the homepage promotes breathability, enhancing readability and preventing text overcrowding, ultimately delivering an inviting and user-friendly homepage experience.
We considered the strategic use of hover interactions and also how this would later affect the inner pages. One such interaction on our homepage in particular of using shapes in the Support Us section as a hover over to show different photographs of children working on art. These interactions should enhance user engagement without overshadowing essential content.
We also thought about how to layout our different folds such as an accurate interpretation of Workshop and Event pages so that we ensures a seamless narrative, guiding users through the diverse offerings.
Lastly, spacing out folds on the homepage promotes breathability, enhancing readability and preventing text overcrowding, ultimately delivering an inviting and user-friendly homepage experience.
The homepage serves as the visual anchor for our brand, encapsulating our design ethos and guiding users through a seamless experience. Achieving a unified visual identity begins with maintaining a consistent presentation of titles across the entire website. This creates a cohesive narrative, aiding navigation and reinforcing our brand identity. Simultaneously, a meticulous approach to text treatment, encompassing alignment, point size, and line length, is paramount. This ensures not only readability but also contributes to the overall aesthetic harmony, fostering a positive user engagement. Harmonizing graphic elements is another focal point for the homepage's success.
From the provided feedback they picked the last iteration on the right.
The homepage serves as the visual anchor for our brand, encapsulating our design ethos and guiding users through a seamless experience. Achieving a unified visual identity begins with maintaining a consistent presentation of titles across the entire website. This creates a cohesive narrative, aiding navigation and reinforcing our brand identity. Text treatment, encompassing alignment, point size, and line length ensures not only readability but also contributes to the overall aesthetic harmony, fostering a positive user engagement. Harmonizing graphic elements is another focal point for the homepage's success.
From the provided feedback they picked the last iteration on the right.
After the final iteration of the homepage was approved, for the rest of the week we focused on to working on the lofi and hifi designs for the inner pages. This included the Membership, Events, Workshop, Membership, Contact, and Donate.
Created different iterations reflecting how they would work on the site builder EditorX we were using. Figuring out it limitations on how much creative freedom we had.
Key features the client wanted:
-The Events section should come after the Artist Development section.
-Make this section look similar to the
Community Workshop section looks like (the calendar list of upcoming events with a button to RSVP) on the homepage
-This section must include Exhibition Open Call events and The Salon @CAC events.
-Explicitly showcase how they can join, location & date, who is the instructor for the event and include image depicting what they are doing.
On Editor X, there was a different interface that worked for booking. Our challenge was to make the event and booking page make sure they looked in the same design system.
Key features the client wanted:
-Have a similar layout to Events Page
-Explicitly showcase how they can join, location & date and include image depicting what they are doing.
Direction we considered while we focused on the About page. Taken from the Homepage were considered images that have imperfect edges color borders misshapen images and images on hover. We also reused the two column (one side text and other side imagery) to match the homepage layout.
Key features:
-Incorporated imagery like the map of Harlem in the hero image and pictures from early stages of the organization detailing their story.
-Played around with anchor points seen in the second iteration with the hearts but reconsidered that notion when we received feedback that it was too confusing and not read as a clickable point or action button to the viewer.
-List faculty and celebrate their previous alumni.
Contact page main function to support community and answer questions about current events, workshops, teachers and other FAQs.
Other key features included:
-Increase in traffic to their different social media channels
- Address, website and how to find their location on a map
-Create traction for their newsletter
Originally not in the site build, however upon asking the client what was the most important thing they wanted to do to help the community.
They responded that they wanted to establish a membership page to foster a safe space for artist's talent to flourish. Not only did they want to learn more about artist in the area but wanted to help them foster connections and celebrate their work.
Key features:
-Apply for studio space
-Build a list/database of artists in the Harlem community to keep them connected and celebrate their works
We designed a Donation page as an online form since CAC is a nonprofit's website that supporters can use to contribute funds to the organization's mission.
Key features:
-After our first few iterations, we received feedback to place the Donate button should appear on the first fold so that the user can immediately find the action button.
-We ended up using a simple alignment instead of several alignments through so that user will immediately be able to understand what they stand for and how to contribute to the cause.
After reviewing the work from week 2, CAC expressed concerns that the colors appeared too childish. We explored various color variations to impart a more mature feel, including adjustments to the hue/saturation of the original color palette and experimenting with muddier color schemes. Ultimately, they approved a slightly darker palette derived from the initial one.
They pointed out that the newer palettes seemed too moody and heavy, while the darker palette from the beginning resonated better with their value of maintaining a lighthearted and breathable composition throughout. The motifs leaned too heavily toward childlike. They wanted to cater more towards teens and young adults.
To address the diverse range of events and workshops, we decided on using a combination of stock photography and their own assets. This approach aimed to bridge the gap for events and workshops lacking specific photos, ensuring visual cohesion across their various activities.
The last one was the final palette chosen.
Once the design was finalized, we transitioned to EditorX to commence the website building process. By segmenting the homepage into distinct sections, we efficiently addressed each component. This procedural approach was then applied to systematically construct the remainder of the site.
