Discipline
Brand Design, Web Development
Timeline
Jan - May 2020
Tools
Sketch, Adobe CC, HTML/CSS
For
BIGD DeCal
Role
Brand Designer, Web Designer/Developer Course Instructor
Summary
Starting from spring of 2020, I was given the opportunity to teach a branding design class. As the other instructors and I wanted to increase exposure, application numbers, and set the standard for branding for our class, there was a need for rebrand given there was none. Thus, we designed the branding and relevant assets, overhauled the course curriculum, and I also took the challenge of coding a website from scratch for homework submission. The result was cohesive brand that was elevated our status as a design class, increased our applications by 30%, and a growing waiting list for the next semester.
Background & Context
Back in fall 2018, I was a student in the pilot cohort for the Branding Identity & Graphic Design DeCal (Democratic Education at Cal). The class is crafted as an exploration of what branding is through the eyes of a designer. Students are able to take the class for a Pass/No Pass grading system, and are mentored to create a branding project. Since then, the class had been taught for another two semesters by the same set of instructors. Once they graduated, Katrina, Mimi and I became the new set of instructors to teach the course.
One of our students’ work, simple foods by Bryan Huang
Design Problem Statement
When we were given the materials, we identified one major area we felt there could be improvement.
The branding class had no brand.
The class didn’t have a logo, nor consistent slide deck materials.
It seemed counterintuitive that a class that taught branding did not have a strong brand itself.
Design Opportunity
Thus, we took advantage of the newfound creative freedom to make the class our own. The design class ought to be reflective of the content we teach.
Our goals for the redesign and curriculum overhaul was:
Create a cohesive, standardized branding guide and assets
Increase exposure and course application rates
Enhance the quality of branding projects
Improve course content
The Solution
To elevate our class into an established design class, we set brand values, marketing assets for promotion, coded a course submission website, branded course materials, and added course changes. We aimed to convey our DeCal as a competent, intriguing and impactful class, and hopefully our branding alludes to this.
Our Mission
We strive to educate and guide students to creating a brand in a collaborative and inclusive space in hopes that they not only develop as designers, but also gain a holistic sense of the importance of design in everyday life.
Poster
Our brand was defined by the anagram, “BIGD” (silly, but it helps to have a shortened name for marketing), strong typography, and glowing gradient circle. Design elements such as the heavy-weight, expanded sans serif header font coupled with a bright purple background reflected the DeCal’s bold personality. The gradient circle highlighted our poster, almost as if it were illuminating a path towards our design DeCal.
Curriculum & Materials
We also redesigned every existing lecture the previous instructors had used (both visually and content-wise). We added greater curriculum changes, and various critique methods to foster a supportive and impactful learning environment.
We added case studies — in depth, business-specific and concrete examples of great branding — and introduced newer topics such as portfolio design, copywriting, mock-ups, composition, and accessibility to diversify the content they learn.
To encourage greater collaboration, design competitions, sprints, and critiques were heavily emphasized, with students going into smaller groups to round-robin ideas or give feedback.
Our slides and demos were also branded in a similar style, with the glowing gradient as an illustration style.
Course Website
I personally wanted to challenge myself to create a website using HTML/CSS to compliment the class. It would also serve as a one-stop shop for students to submit their work, see the syllabus and access resources for the DeCal.
In the past, there was no way to add photos or greater descriptions on the DeCal course listing website, thus the the home page provides the visuals to cater for the prospective students.
Syllabus
In the syllabus section, students can find the slides, recordings and submit their homework.
Previously, students would need to show up to class show with their work, and had no access to previous slides if they missed a class. Given our mission to provide a supportive learning and accessible environment for students, we made our materials public.
With homework now submitted digitally, it was easier to keep track of who was doing what, and critiques were streamlined as the instructors can directly go over the submission file content instead of students need to switch computers each time they wanted to present.
Resources
To provide greater resources for students, we have a dedicated resources page to compile any useful materials. We also decided to hold Office Hours for students who need 1-1 help to cater for students of different skill levels. We found from previous semesters that it was hard to apply the content from Adobe CC Demos directly into their work, so often these office hours were focused on giving tips and guidance on using these programs.
The Result
With our redesign, we increased our application rate by 30%, and we’ve received positive feedback from our students on the course. This particular quote captures our intent with the redesign of the class.
The provided examples give me a lot of ideas to think about. Everything is really fascinating to me, so I’m taking it all in. I also appreciate the feedback given during critique within our groups. I’m always wanting to improve, so it’s a learning experience.
Our brand design aimed to establish the DeCal as a course that could guide students of all backgrounds into becoming designers of their brands, while also exposing them to how design can be incorporated outside the creative world. Hopefully, every student will now have the practical skills necessary to create their own brands, and venture further in the design world.
Honestly, what impressed me the most was the quality of work that came out of the DeCal.
It seemed counterintuitive that a class that taught branding did not have a strong brand itself.
His by Anissa Rashid
The work speaks for themselves
Reflection & Takeaways
Reflecting on the new design for the DeCal, I could see how our brand helped set the standard for the quality of the students’ work as well. The class was hopefully elevated to a status of a design class, and it goes to show how important it is to maintain consistency across all your assets to leave a lasting impression.
Additionally, given it was my first time coding and maintaining a website, my most important takeaway was that the designs you come up need to work with the code in mind. Some of the design altered when coding it, as I realized that some elements were more complicated than they had to be (for example, I wasn’t sure how to code the right handed nav-bar).
Some of the original prototypes.
For the specific functions that I didn’t know how to code, e.g. a personal submission uploads or back-end login portals with screens, I opted to become resourceful and used links to Google Drives for submission and slide access. At the end of the day, what helped me unify user needs, design aesthetics and the coding practicality was to keep it simple.
Overall, I enjoyed teaching the class and I plan to improve the curriculum as I continue to be an instructor for future semesters. Take a look at what the students have done in this gallery!
Also, over the summer we wanted to change it up a bit, so here is our sneak peak of our newer design!
