Archive for the ‘Process’ Category

A Pre-launch Checklist for 2010

Wednesday, January 13th, 2010

Don’t drop the ball now that the ball has dropped! That’s right, it’s a new year, and time to make new resolutions and goals as well as re-commit ourselves to standards and quality in web design and development.  One of the most critical periods in the creation of a new (or redesigned) website is what we at eROI call the “Deploy” phase. This is when all the hard work the team has put into a project culminates to one defining moment when you flip the switch and the site “GOES LIVE” for the whole world to see.  But more important than the actual flip-switching is the pre-launch phase where we make sure the site is ready for prime time, so to speak.

One of the most important steps in the pre-launch phase is an in-depth QA process, including usability and cross-browser testing.  But let’s assume that step has already been completed and your site is bug free and looks snazzy in all the major browsers.  Heck, let’s even say you’ve got a kick-ass mobile version and that everything degrades gracefully with javascript disabled, or on a horrible, outdated browser (I don’t think I need to name names here).

Aside from making sure everything works and looks good, here is a list of items to check on and implement (if you haven’t already).  Many of these may seem rather trivial compared to larger issues like site functionality, but the little details are important and you want to put your best face forward when presenting a new website to the world.  The lack of a favicon may not drive people away from your site, but those small details will be noticed and appreciated by users as well as peers in the industry.  Other items on the list can be much more crucial to the usability and success of the site.

(more…)

Fresh Project: Icebreaker Email

Monday, November 30th, 2009

Finding The Perfect Storm

Often email gets overlooked as a space for telling stories. The primary function is, rightfully, prompting action. However, sometimes the right mix of elements can come together to bring both of these things into one piece. This project was one of those opportunities, so we wanted to share it here.

Icebreaker is an apparel company focusing on a very special product that mixes the versatility of an outdoor technical product, the sleek aesthetic of an activewear product, and the sustainability few companies can boast with its refined merino wool fabric. They have a fantastic brand story and push the envelope with their presence, often using provocative and mythical imagery to support their ethos that reminds us that “it’s about our relationship to nature, and to each other.”

In this instance Icebreaker wanted us to help announce their newest line of clothing for the Spring 2010 season (It’s spring in the Southern Hemisphere). We took this opportunity to not only elevate the presence of their brand in email, but also to use some unique ways of getting their message across. We created two versions of this email, one vertical and one horizontal. Some background on why we wanted to try this out can be found on this previous post by Dylan over on Email Wars.

icebreaker_vertical

(more…)

Fresh Project: Pen Scrappers

Monday, November 30th, 2009

Crafting a Better Experience

We have all sorts of fantastic projects that we get to do on a day-to-day basis. Some amazing clients come to us with challenging problems and often we feel very proud of the solutions. Solutions we think many of you’d probably like to see, and more importantly, know the thinking behind. This is what prompted us to start this new series called Fresh Projects. We hope you’ll find it useful and interesting. As always, we’d love to hear comments and critiques on whether we hit the mark.

This first time around we wanted to show a recently launched site we did for Wacom Technologies – namely, Pen Scrappers – a resource for digital scrapbookers.

Although we had previously worked with Wacom to create the first iteration of Pen Scrappers – which was essentially a contest site that helped generate awareness for Wacom’s Bamboo Craft pen tablet – we were given the chance this time around to up the ante. Wacom had identified this audience as one that they could talk to more specifically, and they wanted to foster the community that already existed by creating a website that would be a strong resource for those looking to hone their craft.

penscrappers2_home

(more…)

Fresh Project: Sterling Communications

Monday, November 16th, 2009

Sterling Communications is a technology services provider located in Portland, Oregon with a national customer base. They specialize in VoIP business phone systems, colocation, and hosting.  Sterling came to eROI this year looking for a complete strategic overhaul of their website, which had grown stale over the years and didn’t reflect what they truly had to offer their customers. Take a look at the home page before we got started:

Sterling_Home_BEFORE_sm

Sterling wanted a solid working relationship with a trustworthy, local agency. After having been through several agencies in the past, they were looking to work with someone new to give them a fresh perspective on their website, company branding, and marketing materials.

(more…)

Designer’s toolbox: LittleSnapper + Ember vs. Evernote

Wednesday, September 23rd, 2009

Part of being a designer for “new media” means constantly exploring new tools and techniques to get the job done. Right now I’m geeking out on LittleSnapper, a sweet little app from RealMac software. It’s not really a new tool, but it’s found it’s way into my workflow quite nicely. It’s essentially a screenshot powerhouse, giving you the ability to capture anything you see on your screen and save it in a beautiful gallery interface for reference later. It uses a system of tags and categories to help organize, and with it’s built-in browser, it can make documenting a website a snap (no pun intended) for things like training guides and case studies.

littlesnapper from realmac software

LittleSnapper from RealMac software

(more…)

Testing Alima Pure

Tuesday, September 1st, 2009

Alima Pure is a Portland Oregon based mineral cosmetics brand with a world-wide following. Recently, we completed a super project with them. It was great for a couple reasons; not only is Alima Pure a marvelous brand to work with from a design perspective (which is always nice!), but we were able to get creative with testing.

The primary objectives for the project were to update the current website with a fresh color palette, refine the typography (using our new AutoTTF WordPress plugin!) and most importantly, re-design the home page to feature more shopping avenues for the user. Projects like these are challenging though, because the homepage was already successful for a number of reasons; it didn’t require a lot of change.

picture-1

Original Home Page Design

The first thing that we knew we wanted to create was a large photography-based area (similar to what was there already) but that featured current products and promotions with clear calls to action. Second, bringing in flexible product areas to feature what is most popular, new or interesting.

(more…)

8 Development Rules on How to Fail Less – Rule #8

Wednesday, August 12th, 2009

Rule # 8 – Define, Specify, Implement.

“You should never, never doubt what nobody is sure about.” W. Wonka

Always write specs! They can be long 1000 page specs or they can be 10 user flow diagrams, it doesn’t matter as long as you have all the people working on the project sign off on them as well as the stakeholders and administrators of the finished project. This will save you some of the major headaches and hurt when things start to get squirrely around launch time and you need to ask for more money or an extension on deadlines because of scope creep. If a developer has to define functionality in the middle of development, alarm bells should be ringing. By the time the developer’s fingers hit the keyboard, there should be no questions about what he or she is supposed to implement. It’s critical to have a functional specification to serve as a guide for the developer. The spec can come in many shapes and sizes ranging from nothing more than a to do list, to a full blown information architecture document complete with use cases. In either case the developer should only concern themselves with what’s the best way to implement a feature, never “what’s this for?”, or “what’s supposed to happen when a user clicks here?”

dont-take-it-personal

Having an agreed-upon document will ground those conversations in reality and a reasonable client will usually have no problem handing over more cash and pushing a deadline back as long as it is reasonable. Buildings are never constructed with partial or non-existent blueprints and thus neither should large websites. Imagine what buildings would look like in that scenario….. it happens more often than it should with websites. Think about that.

8 Development Rules on How to Fail Less – Rule #7

Tuesday, August 11th, 2009

Rule #7 – Use the right tools.

“How many times da I have to tell ya…the right tool for the right job!” – M. Scott

scotty

Many times because of emotional attachment and/or “political” reasons, particular technology platforms are chosen before a project is even defined. This can hurt a project for a number of reasons.

(more…)

8 Development Rules on How to Fail Less – Rule #6

Friday, August 7th, 2009

Rule #6 – Don’t get too attached.

Attachment leads to jealousy. The shadow of greed that is. Train yourself to let go of everything you fear to lose.” – Y. oda

yoda-fail-whale

Everyone likes their own ideas. It’s a fact. People conceive new ideas based on what they perceive as lacking in existing ideas so it’s a natural response to be defensive when those ideas are criticized or altered to conform to another person’s ideas. Developers are particularly guilty of this as over time they develop patterns for solving certain types of problems. Anyone who has worked with developers has no doubt encountered that one developer who is resistant to change and seems like they have a feifdom to protect.

(more…)

8 Development Rules on How to Fail Less – Rule #5

Thursday, August 6th, 2009

Rule #5 – Ask someone else’s opinion.

“In the beginning the Universe was created. This has made a lot of people very angry and been widely regarded as a bad move.” – D. Adams

1312665749_f01e1a27a3

Finally, like a fish cannot survive without water, a large project cannot survive without outside perspective.This perspective comes ultimately from the end-users but long before it reaches the end-user, it starts off in the theoretical realm by some progenitor (the client) and then a facilitator (the agency and/or developer). It then evolves as the developer manifests the vision into something tangible. While this sounds like a pretty good evolutionary process, there really should be more people involved even at the theoretical stage. Things that sound like a good idea to one person and on paper may not hold to scrutiny when a larger sampling of opinion is taken. Don’t mistake this for design by committee as this can be equally disastrous but at the minimum a sampling should be taken from the target audience as some use cases could surface that haven’t been considered. The doomsday scenario for any website is one that has had tons of resources poured into its development and deployment only to fall on its face because the real users don’t want to use it. In conclusion never develop in a vacuum as its imperative to get feedback at all stages of development.

Stay tuned for rule #6: “Don’t get too attached.”