Growing by Leaps and Bounds
How incredible it is to see the growth recognized by the Central Pennsylvania Youth Ballet over the years. It’s amazing to think that some of the finest ballet performers in the country were, at one time, students at CPYB studios in Carlisle, PA. Just as the school has grown — originally conducting classes in the auditorium at Carlisle High School, to its current 10-studio facility that’s instructed over 20,000 students — so too must their identity.
A brand overhaul was in order to re-align how CPYB viewed themselves with how they were perceived by peers. The former identity didn’t fully express the excitement, dedication, and skill put forth every day by the faculty, staff, and student body. Fresh off a redesigned logo, color palette, and standards guidelines, Triple Strength began the extensive process of interpreting CPYB’s fresh look in a visually-striking, functionally-sound web presence that would announce to dance and ballet companies around the globe that the Central Pennsylvania Youth Ballet was taking center stage as a premier institution for learning and development.
The Concepts
Starting out with a handful of concepts, we narrowed the list to three primary layouts, each with their own strengths and style.
Concept 1
Using dark background colors, Concept 1 featured elements that worked to build a hierarchy of information based on a bright playful color scheme, which drew from CPYB’s freshly updated palette. The site layout optimized search engine features with main content areas dedicated to news and events, which would drive up numbers for unique and returning visits.
Concept 1 also made use of a detailed grid system that replicated CPYB’s focus on perfection and rigorous attention to detail. Spacing, alignment, weight and balance were key components to pulling off the effect. This layout such as this adds a structured quality to the site, recalling CPYB as a trusted and established institution.
Concept 2
The second concept focused more on the student visitor’s perspective of the site. Using imagery that showcased human interaction, whether it be a teacher helping students with technique, performers celebrating their first on-stage experience with loved ones, or some playful time between classes, a large primary image area was meant to draw kids to the program. One of CPYB’s biggest accomplishments was the successful establishment of coed classes. As other schools often lack the numbers to match male and female dancers, CPYB realized this capability and was now able to advertise it to potential dancers. The site would tout that accomplishment.
Concept 2′s design also further enabled users to take an interactive approach. Using different style sheets, at the click of a button visitors would be able to adjust the color scheme of the entire site, giving each user a new experience with each visit.
Concept 3
The final concept looked to mimic the on-stage experience in layout and design, with the key element being CPYB’s extensive catalog of event photography. The easiest way to illustrate CPYB’s top-notch performances was to put them front and center.
Again utilizing a black background, images bleed into the margins of the webpage, creating a stark contrast between performers and page boundaries. The design was meant to recreate an actual theater performance. The lights lower, and the dancers appear from dimly lit wings to create a whimsical experience for the audience to enjoy. Now … imagine that with javascript and css styling.
Review and Production
After meeting again with our clients to gather their feedback and which layout they were drawn to the most, we learned Concepts 1 and 3 seemed to be the crowd favorites, but neither one was a show-stopper (pun intended). We took the strongest elements of the two and began to mesh a stronger, more specialized layout. Merging the large format images of Concept 3 with the SEO-friendly content of Concept 1, the new site was ready to begin the transition for development.
While the introductory work had begun on the homepage, layouts were created for sub-level page templates. Pages were assigned a template according to their depth in the directory. Each main landing page, navigable from the primary navbar, was given Template A. Pages below that were assigned Template B, and below that, Template C. With each lower template, the ratio of image to content decreased. Homepage = 85% image to 15% text, whereas Template C is primarily text, with supplementary images for explanatory purposes.
CPYB was then connected to the TS custom content management system (CMS). This allows CPYB staff and faculty to update and maintain content, images, and other materials with little knowledge of programming. Styles and layout functionality are also programmed into the CMS, keeping pages consistent across the site.
To handle the ballet’s videos, the YouTube API is used as a secondary content management system. With the use of this trusted video management software, the site runs faster by hosting large video files on separate servers, gains greater SEO visibility, and saves money on development costs.
Another cost-cutting measure was to develop a public, and access-only calendar, driven through Google Calendars. Much like the YouTube API, this technique uses a free, dynamic, real-time solution for calendaring software. The API also integrates seamlessly, so the front-end matches the look and design of the rest of the site.
With the new cpyb.org now live, the Central Pennsylvania Youth Ballet’s brand reinvention is complete. A sum of all the parts — from logo, to color palette, to website — the new CPYB symbolizes energy, sophistication, and fun.
The Central Pennsylvania Youth Ballet has seen tremendous increases in attendance and overall awareness since its start in 1955. Today’s organization now has an identity that matches its true spirit — standing center stage among other highly reputable dance companies across the country and abroad.
Leave a comment