Case Study: Greenpointers.com

Greenpointers came to us for help with creating a new brand and website for their local Greenpoint, Brooklyn community blog. They wanted a fun, vibrant site loaded with lots of social media integration. The site had to be easy-to-update, as their content is constantly changing. They asked for a lively, bold site that called attention to their values without sacrificing the cool, youthful vibe.

First, we organized the site so that the blog content ran front and center in a clean, readable fashion. We opened up area for ad space along the right-hand side of the page, to increase revenue possibilities, and then we streamlined the social media flow into separate headings for Instagram, Twitter, Facebook and Flickr. This allows the user to see everything at a glance in a neatly organized fashion.

One of the sweetest features is a custom built calendar that includes events submissions, individual event, weekly, monthly view options.

All of the information is easy to update via the WordPress admin so that the client can have complete control over the changing content.

This was a full-scope project for Command C: our goal was to design a site with a friendly and simple user experience and, simultaneously ensure ease of use for our client (the administrator) in terms of navigation and updating content. We also built a custom directory with premium placement options to increase revenue potential.

Check them out! Whether you’re a Greepointer or not, it’s loaded with lots of great information (and reasons to visit)!

Share this post yo:
  • Twitter
  • Facebook
  • email
  • LinkedIn
  • RSS
Posted in: Case Study · Tags: case study · greenpointers.com · 2 Comments

Three Essentials for a Successful Website: Design, Development, and Content Strategy

Our philosophy holds that there are three components of a well-designed website: Design, Development, and Content Strategy. When assembled well, these three components will all work in perfect harmony, each one supporting the function of the other two.

Design is the actual look and layout of your site. What colors will you use? Will you have pictures or just text? Does your company want a young, playful image, or a serious, professional look?  The Design aspect encompasses all of your aesthetic and branding choices.

Development is all the “under the hood” stuff: what kind of platform do you want to use? What about an ecommerce solution? Do you need a custom web app? You want all of this to be easy to manage without getting bogged down with technical jargon so that you can keep your attention focused where it matters.

The third, often overlooked component is Content Strategy, which we discussed in our last post. Content is the actual information you are presenting on your site. (It’s worth noting that there can be some overlap between design and content – images can be part of the overall appearance of the site and also have the task of communicating an idea.) Content Strategy, the choices you make in this presentation, is extremely important in increasing effectiveness of your site and improving the user experience.

A well-designed site will seamlessly blend these three elements, optimizing the effect of each. Our mantra has always been LESS IS MORE, and this applies to all three aspects of building a website. We like white space. We like clarity. We like form and function to have a symbiotic relationship.

Kristina Halverson, our personal Content Strategy Hero, asserts that EVERY instance of messaging (read: Design, Development AND Content Strategy) should accomplish one or both of the following goals:

  1. Support a key business objective
  2. Support a user in completing a task

We believe that these objectives are met once you have achieved a perfect harmony of Design, Development and Content Strategy. If your design is clean and simple, the content will be easy to find. If the content is streamlined and strategically placed, the design won’t be cluttered. If the design isn’t cluttered and the content is easy to find, those are signs that the development was done well.

Attaining this harmony is always our ultimate goal.

Share this post yo:
  • Twitter
  • Facebook
  • email
  • LinkedIn
  • RSS
Posted in: Content Strategy · Web Design · Tags: Content Strategy · Three Essentials · Leave a comment

Content Strategy: What is it and why should I care about it?

Hundreds of books have been written on Content Strategy and its growing role in helping to achieve business goals.  Perhaps you’ve read a few of them, or all of them, or even wrote one of them yourself!  Or maybe you’ve heard the phrase tossed around quite a bit but aren’t exactly sure what it means or why it’s so important.  Here’s our take on it.

In short, Content Strategy is the planning, development and management of informational content.  You have a business.  Your business has to relay information to potential consumers.  You make decisions about how that information is strategically communicated.  Those decisions are called Content Strategy.  You get the gist.

It sounds simple, right?  But so often, businesses suffer because they are not communicating with consumers in the most effective way (i.e. not being strategic enough about managing the content on their site). Have you ever been looking at a website for a museum or restaurant and gotten frustrated by the way information is displayed?  Maybe you had to click three different links to find directions or current offers?  Why are certain sites so seamless and easy to use, while others seem to bog you down with unnecessary information and extraneous pages?

Radio Shack is one example of a site that could gain from more effective Content Strategy.  The homepage is cluttered with information and the organization of the page is such that the viewer’s focus is pulled in all different direction at once:

Compare this to Apple’s homepage:

See how they’ve tucked all the information underneath clean tabs?  They bring a sharp, attractive image to the forefront and minimize the text and graphics below it so that the overall effect is clean, minimalist, and aesthetically pleasing.

Much like you don’t want to wander through a Super K-Mart for hours looking for the right aisle to buy deodorant, no one has time to sift through nonsense in virtual space to find useful information.

Business owners often overlook the importance of content strategy.  They outsource a web developer to cram information into a site and make it look sort of pretty, then shift their attention to marketing and sales – tactics that will surely drive the numbers up, forgetting that their website is often the most powerful tool!  The goal of content strategy is to make sure the impact of content on a website is being maximized to achieve business goals.

Kristina Halvorson, content strategy guru, can convince anyone that the key to running a successful business is managing web content.   We at Command C tend to agree with her, and, as we’ll discuss next week, feel that the elements of Content, Development, and Design are inextricable.  But for now, we’ll leave you with Halverson’s description (from her website www.braintraffic.com) of the serenity that content strategy can offer within a chaotic world of information:

“Imagine a world where content is beautiful.  It’s clear, consistent, useful, and usable.  You know where it lives and exactly what it says.  Your users are delighted.  Your business reaps the benefits.  Your process is efficient.  And you’re happy.”

Share this post yo:
  • Twitter
  • Facebook
  • email
  • LinkedIn
  • RSS
Posted in: Content Strategy · Web Design · 2 Comments

Harnessing the Power

Here’s what’s cool. We’re experiencing a major shift in the world of web design. I have no way to measure or convince you of this other than expressing that my deep entrenchment in this world over the past eight years grants me permission to tell you that I can just feel it.

Computer science is no longer a mysterious and secretive art, practiced and understood only by tech wizards.  Evolving structures of business and the tendency toward self-sufficiency has encouraged everyone to take on some degree of knowledge in the world of computerdom.  Web technology and design have reached a certain point of cultural saturation where the language surrounding it is basically understood by more people (using it) than not. Why is that cool? Because this is the point where we can shift the focus from “how do I do this?” to “what am I doing and why?”

Follow me: when I was in grad school, I spent a lot of my time teaching Photoshop to students. I remember a specific experience that affected me deeply. I was trying to articulate the power of the selection tool and the concept of feathering to a student. When it became time for her to try it out all by herself, she began clunkily clicking around with the mouse. The mouse was backwards. She couldn’t access the seamless, intuitive flow between user and experience to achieve the intended result.

In a way, this experience left me with a deep sense of conflict and crisis. I saw the power of the tools at hand, but couldn’t wrap my head around being able to communicate that power without a basic, intuitive, working knowledge of the hardware necessary to access it.  I wondered if it would always feel like this.

But it’s starting to feel like something else.  People don’t scratch their heads at the mention of API’s.  Eyes no longer glaze over when the conversation references things like “user interface” or “user experience.”  I’ve sensed a shift in this disconnect between technology and user and I intuit that we’ve hit a breakpoint where the basic language of the web has become common language–we’ve finally adjusted to our sea-legs.

Words and acronyms such as blog, CMS, SEO are common language and despite the level of one’s knowledge of these things, at least we all know the general concepts being referenced.

At the same time this shift is occurring, design as a critical business asset is finally being recognized. Businesses are truly understanding the power of design.  It’s something more than just making things beautiful.  Design is as much a business tool as marketing or management, and it is just now beginning to be harnessed in it’s full potential.

It’s an exciting time my friends. Big things are on the horizon. Real shift. I’m grateful we’re here and I’m grateful to be a part of it.

Share this post yo:
  • Twitter
  • Facebook
  • email
  • LinkedIn
  • RSS
Posted in: Business · Leave a comment

Case Study: Just Salad

When Just Salad came to Command C for a full redesign, their site needed some updating and cohesion. Based on an old-school computer game feel, it was cute and kitschy, but distractingly busy in concentrated areas, leaving a lot of dead visual space.

Our first major revision was to make the site responsive, so it would translate well to mobile browsers and focus on the essentials for those users: menus, orders, locations. The mobile view also leverages geolocating and Google Maps to find the location closest to the user.

Next, we added a pretty sweet Google maps integration so customers could find them more easily:

Since Just Salad is a franchise business, we also added WordPress’ multi-site functionality.  With it, the user can switch between locations in various international regions.

This was a full-scope project for Command C: from a design perspective, you can see that we ditched the throwback game-inspired layout for one that showcases actual photos of produce, as well as a picture of Chef Laura, rather than the cartoons that dominated the older site.  (Potential restaurant customers should get to see the actual food immediately, always.)

Go ahead and check them out, and if you’re in New York or Hong Kong, place an order, too!

Share this post yo:
  • Twitter
  • Facebook
  • email
  • LinkedIn
  • RSS
Posted in: Case Study · Graphic Design · Interface Design · Responsive Design · Web Design · Tags: case study · interface design · just salad · responsive design · Leave a comment

Responsive Web Design 102

Last week we touched on the very basic basics of responsive web design, i.e. what exactly it is and why you probably want it for your site.  Now let’s go over what it involves.

Responsive web design isn’t just about changing the display size of a page, since that would do nothing to facilitate user experience (UX) on mobile platforms.  Responsive design’s most important element is the design, not just development or building.  The information on the page has to be scaled just like the display does: the most important elements on the page have to be identified, and those are the ones which have to appear on the smallest version of the page.  For example, take a look at the landing page of our Just Salad redesign:

Now look at the version that shows up on an iPhone screen:

First, you can see that the page is now displaying vertically instead of horizontally.  Second, the five tabs on the full-sized page have been cut down to three, the most important ones for mobile users: Locations, Menu, and Order. We’ve retained the most vital information and removed everything else.

The Just Salad site has one breakpoint–the point at which the page size causes the site to respond differently–but you can have different ones depending on the site you’re designing.  If it’s going to be used a lot for reading on devices like iPads or Kindles, then you’ll want to have a breakpoint for that size as well as an iPhone one–and if you want it to work on different phones, you’ll need different breakpoints for those as well.  (The Boston Globe site has six breakpoints!) The option of multiple breakpoints is another point (ha) in favor of a responsive site rather than a regular one and a different mobile one.  You can keep one set of files, one site on Google Analytics, and ensure that it displays well on a wide range of viewing platforms, not just iPhones.

Having a responsive site will also help cope with the rumored larger display on the iPhone5.  Mobile site owners? Prepare for redesigns.

Share this post yo:
  • Twitter
  • Facebook
  • email
  • LinkedIn
  • RSS
Posted in: Graphic Design · Interface Design · Responsive Design · Tags: graphic design · interface design · responsive design · Leave a comment

Responsive Web Design 101

“Oh, and I want a mobile site, too.”

This is a request that web designers hear all the time, and one that can open up a world of pain (and questions).  Do you mean an iPhone-friendly site, or a Blackberry one?  Maybe you meant iPad?  Kindle Fire?  Android?  Some other obscure and/or yet-to-be-invented tablet?

But here’s the thing: maybe you don’t actually want a mobile site.  No, really, stay with me.  Because in order to reach the most mobile users, you’d have to have various mobile sites ready for various mobile devices, each with its own set of files and data to update.

No, maybe what you actually want–and need, to stay competitive on today’s web–is a responsive website.

When Command C’s head honcho, Sara, asked me to write about responsive design, my immediate reaction was, “Okay…”  So she sent me over to the Boston Globe’s site, designed by the very talented people at Upstatement, and had me resize the window, dragging it from a full 960 px wide down to something about the width of my iPhone.  (Now go, do the same.)

Sara: “When you shrink down a responsive site (i.e. that one) down on your computer, you can see that at certain widths, the navigation changes–whereas with a mobile version, it’s a completely different site, not using the same file names or, for that matter, the same data (which affects things like Google Analytics because it’s a totally separate site).  A Responsive site, however, just changes according to its environment, so it’s essentially the same set of files working differently depending on how it’s being viewed.”

In short, how the site looks and navigates is a direct response to the viewing method it detects.

Command C’s latest launch, the new site for Just Salad, is a responsive site.  If you resize your browser to make it fairly narrow, you’ll see the regular-width site morph into another one, displaying different content on a different layout.

So that’s your very brief introduction to what responsive design is–and why it’s probably a better bet for you than a separate mobile site.  In the next post, we’ll take a look at what exactly responsive design entails!

Share this post yo:
  • Twitter
  • Facebook
  • email
  • LinkedIn
  • RSS
Posted in: Interface Design · Responsive Design · Top Posts · Web Design · Tags: responsive design · web design · 2 Comments

Font Allergies

Technically these are typeface allergies.  Why?  Because fonts and typefaces are not the same thing.  Typeface refers to the design of the character, whereas font indicates the particular combination of typeface, size, and effect.  So Times New Roman is a typeface, but 12 pt. Times New Roman is a font.

But basically they’re used interchangeably nowadays.

The point is, whether you call it a typeface or a font, Comic Sans is nauseating.

 

Share this post yo:
  • Twitter
  • Facebook
  • email
  • LinkedIn
  • RSS
Posted in: Typography · Tags: terrible fonts · Typography · Leave a comment

Case Study: The Brookeside Group

We’re really proud of our latest site launch, client relations firm The Brookeside Group.

This was a full-scope redesign and development project that included rebranding, UI/UX design, and custom development on the WordPress platform.  Our mission was to create a fresh and cohesive look and feel that communicated the company’s accessibility and professionalism. We leveraged WordPress’ flexibility to create unique page templates for each interface, and built a custom demo plugin that allows users to register for demos directly through the website.  On the UX side of things, we strategically placed testimonials and calls to action to establish trust more quickly and offer a guided-path user experience.

Here’s what it looked like before:

And here’s what it looks like now:


Share this post yo:
  • Twitter
  • Facebook
  • email
  • LinkedIn
  • RSS
Posted in: Case Study · Graphic Design · Interface Design · Top Posts · Web Design · Tags: brookeside group · case study · ui design · ux design · web development · Leave a comment

Teamwork

It’s kind of a glorious thing, being an independent creative.  No one to report to, no one to monitor, no other opinions to consider, just you and, if you’re lucky, the client.  This is great if your business is as specific as your talent: you devise logos, or make letterpress stationery, or code sites. For web designers, things can get a bit stickier.

There’s a very real possibility that as your business expands and your client list grows, you’ll be asked to do more.  Maybe you’ll start by farming out odd-jobs to freelancers here and there, and that might work for a while, but if you’re built to last, you’ll outgrow that model and need a more reliable structure. Then it’ll be time to put together a team.

They can be independent contractors or in-house employees, whichever model works best for you, but what they really need to do is mesh with both your work and your working style. Having similar tastes is a great start, but make sure that those tastes aren’t identical (because you’ll never get pushed to grow that way), and find people whose communication style makes sense to you. The reverse is true, too: they need to get you.

So what does a start-to-finish independent web design firm need to make sure all its bases are covered? Most entrepreneurs go into business because they have a particular skill. Before they know it, they find themselves hardly doing that thing they were first passionate about and mostly juggling the different tasks of running a business.

Below are the different core components of a web design and development firm. At first, you, the business owner, may find yourself wearing multiple hats–you should be until you’re business is at the point where you can’t possible imagine doing one more thing. That’s a good indicator that it’s time to start hiring. Start slow. Figuring out which position to hire for can be tricky. Our president, Sara, asks herself two questions when she hits this point: 1.) What do I enjoy doing least (and am therefore probably not doing best)? and 2.) What’s the easiest to systematize? Once she has the answer to that, she knows the job that needs to be filled and can draw up a clear job description identifying all of the tasks and processes relevant to the position.

  1. Design Team.  Okay, duh, you’re probably thinking, a web design firm needs a design team.  Thanks for that useful tip.  But I’m serious!  Maybe you’re more interested in the management part of the business, or your love of coding runs deep.  (I know you guys exist, right? Somewhere?)  Working with a team is a chance for you to specialize in whatever piece of the pie you love most (cherry, obviously) and really master it.  You’ll need a graphic designer and a UX designer.  Yes, they’re different jobs.  Your UX lead doesn’t just need to know web design and the intricacies of user experience design.  No, she or he has to get people and do a great job interacting with them, because this is someone who’s going to be in a lot of direct contact with clients. Oh, and you should like them, too. 
  2. Development Team. O hai, yes, you need one of these if you want to build people unique, personally-tailored sites.  These guys will be your tech zen-masters, and as such they should know all the languages your firm specializes in. At Command C, the development team is also critical to the inquiry process: they weigh in on how we should approach projects and exactly what work will be involved–something only a developer would know.
  3. A project manager.  Unless you want to lose track of things (but really, who are you?), your business is going to need a project manager.  Assuming you’re handling at least five clients at a time, you’ll need a dedicated individual who can keep each project and its related tasks moving forward.  Sure, it’s simple enough to do this yourself at first, but between all the communication and tracking involved, you’re eventually (if you’re lucky) going to have too many clients to do all this and your own job.
  4. A social media/communications specialist. This is clearly the most essential job, because this is what I do.  You need someone who gets social networking, gets copywriting on numerous levels (advertising, editorial, personal), and gets you contacts.  These can be clients or co-workers, but this person needs to be great with language and people.  Preferably without being cynical and calculating about it.
  5. A Head of New Business.  Yes, at Command C, I do this too!  This is part and parcel of making contacts in communications.  Your New Business gal needs to know how to research, be professional, approachable, and sociable, and be outgoing enough to take that first step of reaching out to potential clients.

Once you have your team, you’ll be set to grow your business comfortably and sanely.  Also, you’ll have a dedicated group of people for team building exercises, like trust falls and rock-climbing.

Share this post yo:
  • Twitter
  • Facebook
  • email
  • LinkedIn
  • RSS
Posted in: Business · Graphic Design · Interface Design · Tips · Web Design · Tags: Teamwork · 2 Comments