Marvin Pierre is Executive Director of Eight Million Stories, Inc., a nonprofit founded in 2017 to support disconnected youth in Houston, Texas. Building upon the success of Eight Million Stories, he is founding a new school in Houston’s Third Ward. Marvin chose Jill B Gilbert to create a brand for The Justice Hub School that is attractive, edgy and has an urban feel. This project also included development of a brand guidelines document that will grow with the organization.
Your website is an important part of your organization’s identity. A well-designed website reflects well on your organization, and a poorly-designed website can damage your reputation. I know this is hard, but spend time planning your website before you build it. Understand your audience and design your site accordingly. Make the site attractive and easy to navigate.
Whether you plan to redesign your website or are in the enviable position of designing a new website from scratch, take the time to find answers to the following questions to set your website project up for success. You will be glad you did!
Granted, 30 questions is a lot to answer—but take the time to find answers to every question if you want a website that addresses the needs of your audience and yields business results. If you are not sure how to proceed with your website design and build, please consult a professional that understands the technical, marketing, and business aspects of website creation. You will be glad you did!
“Jill was wonderful to work with. She responded positively to our initial feedback on a design and came back with an update that accurately met our needs and vision while incorporating her professional expertise in PowerPoint and graphic design. She is prompt, communicates efficiently, and pushed the project along at times when I felt overwhelmed. We now have a well designed, branded, and functional PowerPoint presentation that will bring cohesiveness to all our presentations. Thank you Jill!”
–Callie Sacarelos, Communications and Marketing Manager, Mississippi Park Connection
A brand is how your customer or audience views your business. A brand includes your organization’s brand identity—a logo and other assets used to convey your message; a brand strategy or blueprint; and brand marketing to spread your message via different digital, print, and word-of-mouth channels.
If you need a new logo, you can work with an in-house graphic designer or hire a freelancer. Follow the eight tips below for a greater chance of success.
Why do you need a new brand? If you are just starting out, you may want to brand your products or services. Maybe you are launching a new product or service within an existing company. Perhaps you have a brand, but feel it is outdated, or it no longer reflects your organization’s mission, vision, and values. Do a majority of stakeholders share this need?
What do you want to accomplish with your new brand? What benefits do you expect, for example, the ability to reach larger audiences via new digital and print channels, greater market share, easier brand recognition, or other?
A brand is how your customer or audience views your business. A brand includes your organization’s brand identity—a logo and other assets used to convey your message; a brand strategy or blueprint; and brand marketing to spread your message via different digital, print, and word-of-mouth channels.
Do your homework before working with the graphic designer. With graphic design projects, it’s easy to express what you don’t like, but not always so easy to express what you do like, and what you really need. Talk with your stakeholders to get a feel for their needs, wants, style, and color preferences. Do a little research and find 3-5 examples of brands that inspire you; be prepared to talk with the designer about how similar aesthetics might work for your organization.
Creating a brand is a project that should follow a process. This process typically includes the following steps:
The designer should set expectations upfront regarding the project schedule and specific deliverables, such as the number of concepts and rounds of revisions.
You will use your brand in digital and print formats, maybe on signage, T-shirts, and more. Apply your brand consistently in multiple applications such as full color, all black on light backgrounds, and all white on dark backgrounds. Make sure that your brand looks great and reads well in different sizes, from an inch or two on a business card or letterhead, to a 12-foot banner at a trade show. You might need a horizontal layout on your web page or a large banner, a vertical layout on stationery and business cards, and an icon only for a website favicon.
If you do not have Brand Guidelines or a Visual Standards Guide, this is a good time to create one. Such a guidelines describe your organization’s official colors for print and web materials; your official logo/brand layouts and color combinations; logo/brand placement; and typography for web and other marketing communications. A brand–even when it consists only of letters or words–is artwork that must not be altered in any way, such as changing the aspect ratio, colors, or typography. Make sure that your staff is aware of the standards and their use.
A brand is one of your organization’s assets and becomes more valuable as it becomes widely used and recognized in the marketplace. Protect your brand like the valuable asset it is—stick to your Brand Guidelines/Visual Standards Guide—always! Add a trademark (™) or service mark (SM) symbol to your brand, and apply for registered trademark status (®) as appropriate.
Jill B Gilbert is pleased to be selected to refresh the logo and create a visual brand guide for BHK Child Development, Inc. This early childhood care and education non-profit serves three rural counties in the Upper Peninsula of Michigan.
The new BHK logo incorporates a tree to symbolize children and growth and to reflect the natural surroundings in which many of the non-profit’s programs take place. The new color palette includes soothing blues and greens with dark gray.
Paul Rand designed the IBM trademark, the Westinghouse “W,” the marks for American Broadcasting Company (ABC), UPS, Esquire Magazine, Harcourt-Brace and other memorable trademarks. A recent post on logodesignlove discussed a 1971/72 article by Stanley Mason on how Rand presented his work to clients. Long before the days of digital graphic arts, Rand created short-run offset print publications to present to his clients. Paul Rand avoided flashy presentations and let the work speak for itself, presenting booklets to the top decision-making executives. This was pure genius, as these printed materials helped cement the designs as finished products.
In the article, Mason wrote that the trademark “should be distinctive, memorable, and reflect in some way, however abstractly, the nature of the product or service it represents.” Rand’s rebranding of IBM added eight horizontal stripes and a brilliant blue to the previous trademark. This added movement and color made the mark more dynamic and memorable. It remains strong today.
The ABC logo is simple and understated, yet everyone remembers it. Image: Wikimedia Commons
The NeXT computer logo may not be as memorable since the company disappeared. Image: Wikimedia Commons
You can read more and download the Mason article here.
Whether you are developing a 50-page Website, a small mobile phone app, or an annual report for a corporate client, you should get in the habit of developing a style guide.
Branding and style guides are important for projects large and small. They help to provide consistent messages about an organization and provide a degree of professionalism. Creative Bloq has a good post on this topic, with examples of thirteen style guides for famous organizations.
The client’s goal was to refresh their brand and their Web site to draw more customers to their wellness practice and retail establishment. I prepared a simple style guide, using Adobe Illustrator. The Style Guide displays the brand, color chips for main and accent colors, typography and usage examples:
Here is how the styles look when applied to a “mobile first” Website design. Note how the colors and the leaf motif are repeated throughout the page. The design works well on a smartphone, on a tablet or on a large HD screen.
On a whim, I researched my alma mater’s color and brand guidelines. The Miami University is a nationally recognized Public Ivy, and its brand is particularly important. The brand must convey the Public Ivy experience.
The University uses different reds for print, Web and merchandise use. Several formal and informal logos are available for these uses. The use of certain “vintage” logos requires special permission.
The branding guidelines include logos, colors, typography and graphic elements. They encompass Web, print publications, social media, photos, use in athletic programs and more.
How people – alumni, students, future students, faculty and staff, fans, donors, and the public at large – feel about Miami University directly relates to the University’s success. In a sense, the brand speaks on the University’s behalf without saying a word. It represents who we are and what we stand for. It is the visual representation of our reputation.
Miami University Brand Guidelines
Here is the “M” spirit mark often used on sportswear and signs.
More and more big companies commission their own typefaces, rather than relying upon the thousands of fonts readily available for marketing their goods and services.
This month, The Coca-Cola Company (TCCC) introduced its bespoke Unity font. Depending on who you ask, some designers love it, and others hate it. Coca-Cola has used a script logotype for decades, and a while back introduced a serif font with the word, “Coke.” Unity is a departure; it is a sans-serif typeface family with several weights.
In 2017, IBM rolled out its bespoke typeface families, named Plex, and YouTube introduced YouTube Sans.
In 2016, Apple introduced San Francisco typefaces at its Worldwide Developer Conference. These fonts were inspired by Helvetica, and were developed for ease of reading on small screens like the Apple Watch and iPhone, as well as on iPads and Mac computers. The same year, CNN introduced CNN Sans—also modeled on Helvetica.
In 2015, Google rebranded its famous “G” using a proprietary font called Product Sans. Product Sans closely resembles the Futura typeface. Google rolled out Roboto In 2013 for the Android OS. Also in 2013, Mozilla rolled out typefaces for its Firefox OS, called Fira Sans and Fira Mono.
It’s all about branding. We are bombarded by thousands of advertisements each day on smartphones, tablets and computers. We see an ad for a fraction of a second before engaging with the brand or discarding the ad. According to Envato, having a recognizable logo is not enough. Companies must stand out from the competition using logos, colors, copy and typography. This is where custom typefaces come in.
Branding requires notable logos, colors, copy and typography. “Bespoke fonts offer brands more control over their identity, and in some cases can even save them money in the long run.”
–Envato
Helvetica (Neue Haas Grotesk) was developed in 1957 by Swiss typographer Max Miedinger and became the de facto standard of international typeface design in the mid-20th Century. It remains popular today—Helvetica Neue is the default Mac font—because it is both readable and legible at many different sizes and weights.
Helvetica is not going away anytime soon. It is still the favorite of many designers because of its versatility and simplicity. Just make room for the new, bespoke typefaces to coexist with Helvetica.
Branding and style guides are important for projects large and small. They help to convey consistent messages about an organization and provide an insight into the organization. Creative Bloq posted examples of thirteen style guides for well-known organizations, from Adobe and Apple to Firefox and Urban Outfitters.
I attended The Miami University in Oxford, Ohio—established by a charter signed by George Washington and founded in 1809—not the much newer school in Florida. I researched my alma mater’s brand guidelines and found that Miami uses different reds for print, online and merchandise. The Web site provides guidelines and downloads of formal and informal logos in different styles and sizes for print, Web and merchandise use. Certain “vintage” logos require special permission from the University.
Here are examples of school “marks.” The formal signature is used on official stationery and for formal publications; this is one of several. Informal signatures are used for merchandising, sports, and other purposes.
Miami’s branding guidelines also include Web standards. It was interesting to see the fonts used. I learned about a new font, Promesh, which looks good on athletic wear and athletic posters. You can download Promesh One and Promesh Two here.
When coding a client website, I needed to make several adjustments in heading and body text size. As a recent blog post by Christian Miller (aka Xtian Miller) says, you can make body text too small, but nobody complains if it is too large. The benefits of using LARGER body text include:
Miller says that the majority of Web sites use 15-18 px body text… which brings to mind the (rhetorical?) question that I posed last week–which units to use, points or pixels–when sizing text? I started to use ems and % for line height in my last few Web projects. I like using these relative measurements rather than fixed measurements, once the base font size is defined. I can also use these relative units for font height, for example, headings and other text used for highlights and emphasis.
Miller also writes that “Mobile First” designs can cause designers to be afraid of using larger body text. He provides examples of several sites that use 20 px or larger body text, including Jeffrey Zeldman’s.