Responsive Website Design June 28th, 2011

Your website is being viewed on multiple platforms ranging from small to large screens, and from desktops to cell phones. So how is it possible to get your content delivered in a readable and attractive format for all these devices?

Being responsive

Responsive Website Design is the answer. Instead of trying to tightly control the viewing experience on each device platform, it is better to embrace the flexibility of the web and design with that in mind.

Start by making your page elements flexible. Instead of setting type on a homepage in pixels, style it in ems, a relative measurement which will adapt to different screen sizes. Set the width of elements within the page design relative to each other, so the integrity of your design isn’t lost on an iPad or Blackberry, or even a PC from 1995 for that matter. These changes can turn a good website into an adaptable, accessible one.

Design for a common denominator. What does the user really want? It depends on how they’re viewing it. If they’re looking up a restaurant on a desktop, splashy photos might be nice. However, on a mobile device, the address and hours are far more relevant. Why not display the hours and address on the top of the page anyways? Then follow with descriptive text and nicer images.

Keep hierarchy in mind. What’s most important on your web page? You can specify the hierarchy of elements in your webpage design to load in a specific order or even disappear based on screen size, and create an option to drop slower-loading elements if the site is viewed on a mobile device. These changes ensure that all visitors are exposed to the only most relevant and important sections of your site.

The market is always evolving. There will always be a new mobile phone, computer, or who knows, another format altogether. If you choose to design flexibly from the start, you message will be heard across all platforms.

Posted in Uncategorized | No Comments »

Kickass Website & Usability Tips April 22nd, 2011

As seen on the MITX Blog!

Conventions of the web are always evolving, but in the past year or so, it seems as though the standards have changed drastically. It is important for companies to take their web presence seriously and keep up with the latest online trends and technologies.

Here are five tips you can use to improve your website right away.
Read more on MITX’s blog.

Posted in Uncategorized | No Comments »

Extreme Website Makeover: Kicking it Up a Notch with Video April 19th, 2011

Boston Website Makeover Event
What do YOU look at when you’re surfing the web? We’re all busy. Too busy. So our web surfing time is very self-centered. We’re looking for the most interesting content in the quickest and most digestible format. AKA: video.

Want proof? Go to any major news site. They feature videos so often, you may actually have a hard time finding articles to read. Videos are quick to watch, easy to understand, and easy to share!

Metropolis Creative partnered with Brightcove to add video content to our 3rd Annual Extreme Website Makeover Event. Wanting to grow the event beyond the fact that we’re giving away a website makeover, this year we kicked it up a notch by adding an Innovation Video Series. Here’s how incororating video brought this event to the next level:

  1. Credibility. Having smart content on our website helps elevate our brand. Sure, we can talk about innovation and branding until we’re blue in the face. But once there are others saying similar but complementary things, we gain credibility. Video interviews are much more compelling than a text snippet or quote.

    2.  

  2. Sticky content. We’re not so naive to think that our target audience will be as enraptured with our event concept and website as we are. Additional content such as weekly videos will continuously drive new and repeat visitors to the website.

    3.  

  3. Shareable social content. Social media users are constantly looking for good content to share. When we upload a new video, we announce it via our social channels and drive traffic to the website. We’ve also made it easy for users to tweet or like these videos once on the site.

We’re seeing video being used increasingly as bandwidth and platform compatibility mature. Brightcove has taken a leading role in making it easier for agencies like us to incorporate video into compelling web design strategies. Their technology helps publishers make sure the viewing experience is branded and consistent for viewers across every device.

And let’s face it – video is cool. We spent a little extra effort by using professional-grade equipment, and spent some time editing too. But you don’t really need to do that. The public is so used to amateur video, that the overall quality generally won’t degrade your message or brand.

Check out how we used Brightcove’s video platform on our Extreme Website Makeover event, and then come to our party on April 26th to see how we make over one lucky company’s website!

This article was featured on Brightcove as a guest blog. You may view the original article here.

Posted in Uncategorized | 1 Comment »

Five Easy Steps to Editing Your Own Work March 23rd, 2011

happy writer
In a perfect world, you’d never have to edit your own work, but well, you know the drill. The world’s not perfect, life’s not fair, yada yada. So spend a little time now or a lot of time later trying to convince your boss to let you keep your job as a “public relations director.”

Step One: Just walk away, Renée (or Kevin or Amy).

We all know that when we’re too close to things, we don’t see them clearly. This can be good for relationships, but hazardous for the editing process.

See, you know what you meant to write, so your eyes just fill in the blanks, overlook typos, etc. That’s why you need to get a little distance. So after you write a first draft, go get a cup of coffee or take a walk to clear your head.

Step Two: Imagine you’re not you.

Instead, imagine you’re the intended audience reading your document for the first time. The big questions you want to answer here are:

  • Does it make sense? Would the reader understand what you’re trying to say?
  • Does it hold your interest from start to finish?
  • Does it include all the information you need (e.g., important numbers, URL, event location)?

Step Three: Is your writing PHAT or FAT?

I don’t mean to give your writing body image issues, but if it’s not lean and mean, you’ve got some work to do. Here are three ways to lose the fat:

  • Trim long sentences: If any are longer than 25 words or so, consider turning them into two sentences or removing any unnecessary words.
  • Slim down the words: Replace long words and phrases with short ones. In other words, why say “ascertain the location of” when you can just say “find”
  • Remember that black flatters figures, but white flatters writing: Nothing is more daunting to a reader than a dense block of text. Add some breathing room with white space between paragraphs, bold subheads and (where appropriate) bullet points.

Step Four: Listen to your high school English teacher — except when it’s best to tune her out.

Marketing writing is not the same as writing for your old English teacher. For example, you can in fact start a sentence with “and” or “but.” But only if it adds clarity and impact. That said, she was right about a lot of things. Here are a few major points we can all agree on:

  • Good writing is error-free. This means perfect spelling and no typos.
  • Check for the correct use of homonyms like to/too/two, their/they’re/there, etc. Spellcheck doesn’t always make those distinctions.
  • Confirm you’ve spelled all names correctly. This mistake can be particularly embarrassing.
  • Good writing avoids the energy-draining passive voice. Write Bob threw the ball. Not The ball was thrown by Bob.
  • Good writing is formatted correctly. Check your margins, use of spacing and consistency in style of headings — font, bold or not bold, capitalization, etc.

Step Five: Now clean it up and read it again. Out loud.

After you’ve made your revisions, print your document (don’t edit onscreen!) and read it again. If you’re in a crowded office, whisper instead, but don’t skip this step. You’ll be amazed at how much you’ll catch.

Yay, I’m done! Does that mean it’s perfect?

Don’t feel bad, but probably not. Editing is a real skill that can take years to perfect. But if you follow these recommendations, you’ll greatly improve whatever you write. You’ll have done your best, which is all anyone can really ask. And yes, I’m happy to tell that to your boss.

About the Author

Anna Goldsmith is a partner at the Boston-based copywriting agency, The Hired Pens. Her work has won numerous awards, including a Hatch, Webby, MITX, and a W3 Gold. You can reach her at anna@thehiredpens.com.

Tags: ,
Posted in Uncategorized | No Comments »

The Simple Truth About Logo Design February 9th, 2011

How is it that simple icons like a swoosh or an apple have become such powerful brand images? Obviously, Nike and Apple did not become multi-billion dollar brands overnight; they had to work to build their images. I have no doubt that Apple would not be as successful as they are today had they stuck with their original logo design from 1976. The dramatic pencil-sketch did not fit the clean, innovative brand it was to represent. The point here is not how hilarious the old logo may or may not be, but rather how simplicity and focus are at the foundation of virtually every successful logo.
comparison of Apple logo designs
Simplicity in logo design is absolutely essential to a strong and lasting image. Unfortunately, many designers these days are pumping out radical new logo designs sporting gradients, drop shadows, textures and overly complicated designs in an effort to stand out (note all Olympic logos as of late). It is true that originality is harder and harder to achieve in a world with millions of competing designers and logos, yet the designs that achieve simplicity in new and interesting ways are destined to be the iconic images of tomorrow.

Lets look at the ways in which a simple design can benefit a client:

Versatility

In the 21st century, a logo is bound to exist across a variety of media; on a business card, on a website, in a magazine, maybe even the newspaper. This means your logo will appear in a multitude of sizes in both color and black and white. It is a good idea to complete a logo design in black and white before color is introduced in order to make sure the logo does not rely on color or effect in order to be successful. At Metropolis, we also test the logo at various sizes for legibility. It may look great on screen, but nothing more than a smudge when reduced small on a business card.

Recognition

It is much easier to recall simple imagery, so why would you want to complicate the face of your company? Picture the McDonald’s logo. I bet you can see the curves and the bright shade of yellow exactly as they exist in real life. Now picture the logo design for the American media giant MGM… Having trouble? I bet you have seen it hundreds of times, it might be at the beginning of your favorite movie, but its complicated imagery and details make it nearly impossible to conjure up from memory.

Message

Ideally, a logo would say something about what a company stands for, or what they do, in a simple, smart way. A good logo helps describe the company with color, typography or elegant iconography. Even if your brand is all about energy or movement or complexity, a clean and simple mark can still be successful. Many companies, like Facebook, Crate & Barrel and Barney’s, use nothing but type in their marks, yet each seems to describe their respective companies differently. The Facebook type is more digital, or technical, the Crate & Barrel more conservative, and the Barney’s more classical and sophisticated. More often than not, an attempt to explain a brand through the logo ends up complicating the design and confusing the viewer.
comparison of facebook crate and barrel barneys new york logo designs
Most people are uncertain as to what makes a logo successful. A designer’s job is to not only create something with visual appeal, but to help the client understand why the design was created the way it was and how it will benefit the company. Designing a logo is the ultimate exercise in problem solving. There are infinite answers, but the one that works best will make noise without having to yell.

Tags: , , , , ,
Posted in Uncategorized | No Comments »

Using Game Mechanics in Website Design January 27th, 2011

This excerpt is from a guest blog post that Michael Flint wrote for MITX. Read the full article here.

The Game Asteroids

It’s hard work getting new visitors to your website, and it can be even harder to keep them coming back for more. The latest trend is “game mechanics,” an entertaining way to facilitate interaction with your audience.

What Is It?

Game mechanics is the art of turning customer interaction into a game. Customers are encouraged to take an action (such as comment or share information) and are then rewarded with intangible items such as badges on their profiles or listings in a website’s leaderboard. It’s much like when you used to get high scores in Asteroids; people like to see their name in lights.

Many Wesites Are Using It Now

Foursquare and SCVNGR award badges that appear on a user’s profile for everything from the number of checkins to rewards for specific activities. Groupon uses a visual sand dial countdown to show how much time is left, the total number of deals bought, and to encourage you to buy quickly and become one of the winning deal recipients. And companies like RunKeeper allow you to send progress updates to your Twitter and Facebook status every time you use their product. Free advertising for them, bragging rights for you.

More…

Tags: ,
Posted in Uncategorized | 2 Comments »

Social Media: Competition On and Off the Field January 24th, 2011

Twitter in the NFLIn a day and age when just about anything and everything regarding our favorite celebrities and professional athletes is accessible with a click of the mouse, it’s no wonder Twitter is at the center of all the buzz. The easy to use microblogging site has seen a huge increase in “verified” professional athlete accounts in the past year. The site Tweeting-Athletes.com categorizes the athletes using twitter by sport and team with a direct feed to each players’ tweets. We now know when they wake up, what video games they are “dominating” and how much they spent on their latest Bentley, or two. With this running commentary on the sporting world at everyone’s finger tips, of course we would see some controversy when it comes to the innate competition that these athletes seem to eat, sleep and tweet.

Back in September, David Price of the Tampa Bay Rays was ridiculed for speaking out on Twitter about the Ray’s lack of fan support. “Had a chance to clinch a post season spot tonight with about 10,000 fans in the stands… embarrassing” Fans and critics alike bashed Price on his “rude” statement, who later apologized writing “If I offended anyone I apologize I did not think it was gonna turn into this…” Price was right — who knew that one statement could cause such an adverse reaction. This was when the social media tool really caught my attention in a different light.

Fast forward to this past week’s NFL playoff “trash taking” fiasco. The Patriots and Jets went back and forth for days with “clever” instigations in press conferences and bold statements on twitter. It is the first time we, as spectators, have a more than direct insight into the thoughts, feelings and actions of these athletes on a minute to minute basis. Players were accused of abusing their 5th amendment rights in press conferences and on twitter. What could have once been seen as “private” personal thoughts in 180 characters or less, are now public statements permanently stamped into the the archives of Twitter.

Twitter has been seen as a distraction for many athletes. The NFL has been known to fine players for using electronics near game time out of fear of cheating. NFL player Chad Ochocinco was fined $25,000 for tweeting too close to the start and finish of a game. Shaquille O’Neil even tweeted during halftime while playing for the Suns… thankfully the Suns won that game. Boise State’s head football coach Chris Peterson banned his team from using Twitter during their latest season. “It’s just a distraction that we don’t really need to have right now. There’s plenty of time in their lifetime for Twitter” Peterson said. Much of Peterson’s concern revolved around his team and their relationship with the press. Many times collegiate coaches keep certain players, often freshman, from talking to the media all year. Twitter has blurred the lines of public statements into a more casual “from-the-couch” press conference.

Coaches, such as Jet’s coach Rex Ryan, have come into press conferences unaware of the comments “tweeted” minutes before by his players and are already on-deck questions from reporters. Coaches are also concerned with spending weeks and months working on formations and plays just to have players reveal these intentions in their comments on Twitter. Even though Twitter has not lead to any consequences like that of the fine for a helmet-to-helmet hit, it still unknown how the site will effect the future of professional sports, on and off the field. I mean let’s face it, we all saw how Wes Welker’s comments in a press conference probably cost New England the Super Bowl.

Tags: ,
Posted in Uncategorized | No Comments »

5 Website Design tips for Nonprofits January 4th, 2011

Many nonprofits suffer from low budgets. But there are many things you can do incrementally to quickly improve your website’s effectiveness.

Make the site User-Friendly

Just as with any site, nonprofits should follow the basic guidelines for web design. Ease of access and navigation are as important as visual aesthetics. It is also important to make the site media friendly, an easy information site for journalists. Contact information should be accessible and downloadable images can help with cohesive media coverage.

Good Content Informs and Energizes

The organization’s main purpose should be immediately apparent. Why should the user be donating or volunteering? It is important to list out the goals of the organization ahead of time and work with these priorities as guidelines. Some organizations have different departments and people heading those departments.  Have each write the content for their respective department so that the best description is captured.  Great images will always enhance your message. Every image should help tell your story to get the most emotional connection for your cause. Videos are an even better way to show programs in action. Even simple image animations can be informative and engaging.

Ask and You Shall Receive

The most common goal for nonprofits is to raise money for their respective causes by appealing to donors. Tastefully but directly show how easy it is to make a donation with a button or donation area in plain sight on every page. Using direct messages like “DONATE NOW” will be more effective than passive language asking for donations. Other Calls to action can include applying for a grant, attending an event, opting in to various communications channels (Facebook, Newsletters, Emails).

Mobilize Your Army of Volunteers

Another target to keep in mind are the volunteers. Use call to action terminology like “Take Action” or “Ways You Can Help” to prompt users to act.

Social Media Was Made for Nonprofits

  1. Social media users are always looking for good content to share.
  2. People are more likely to respond (donate, volunteer) if they know you.
  3. Viral social communication can reach exponential numbers.

Maximize your social network by incorporating social tools everywhere. Let users promote your content via “likes”, “tweets”, and “shares”. Banners, and widgets that link back to your site can be made available for others to install on their own sites. Letting users comment on content also creates a strong engagement bond.

Quick Takeaways

  • Create a newsletter to keep people up to date with your organization. Be sure that signing up for a newsletter is easy and accessible.
  • Include a news/blog section to show that the organization is a living, breathing thing. It will keep people up to date with stories and news directly from the people volunteering and projects being put in place. Updating this often will help keep the site alive and people interested in what you are doing as an organization.
  • It is important to “keep it real” and not come off as a business. Yes, nonprofits are businesses in themselves, but they are in the business of making a difference. People want to know that their money is going to something meaningful.

What web design tricks have most helped your nonprofit business?

Tags: , , , , ,
Posted in Uncategorized | 3 Comments »

Cause Marketing — Inspired To Do More December 16th, 2010

This morning a few of us from Metropolis attended the 21st Social Media Breakfast in Watertown. The theme of the breakfast was Social Media for Social Change with a concentration on mobility. Scott Henderson of causeshift, Laura Fitton of oneforty.com, Joe Waters from Boston Medical Center and Steve Krom of AT&T all spoke on how easy it can be to get involved with social change through social media channels. Through the use of twitter and growing technologies such as micropayments, anyone can get involved to support nonprofits, charities and help in building communities to aid organizations and social movements.

I was especially inspired by Laura Fitton, who began a movement (@wellwishes) two years ago in conjunction with Charity Water. Her goal of raising $25,000 began with blog posts, tweets and video messages that, within only a few months, turned monumentally successful. We love what she has done with her work for Charity Water and recent work with her start up oneforty.com. Laura’s comment “I do not have my act together, don’t let that stop you from changing the world”, really resonated with us.

Boston World Partnership Web DesignBoston World Partnership Web DesignMetropolis has been involved with non-profits such as Boston World Partnerships and their Global Tweet-up, helping to put Boston on the map in the world of social media; as well as supporting MITX in a variety of roles including designing their Facebook page and producing promotional videos. Recently, we have taken on the task of designing a website and marketing plan for a charity out of Uganda that specializes in helping orphans receive the medical attention, education, nutrition and capacity building skills that will create a complete and holistic approach to improving their lives immensely.

We are looking forward to applying this and other knowledge we learn from events such as the Social Media Breakfast to our 3rd annual website makeover next year. Stay tuned to see how you can become a part of it all.

Tags: , , , ,
Posted in Uncategorized | No Comments »

Co-branding December 14th, 2010

What is the importance of co-branding and how should it be used? Watch this brief video to learn a few quick tips from Metropolis.

Tags: , , , , , ,
Posted in Uncategorized | No Comments »

« Older Entries