Nov 30, 2009
Over the last couple of weeks we launched two projects of note that turned out exceptionally well. Our thanks to Xgaming and EACEF for letting us be a part of their new website projects. Both clients are fantastic to work with.
Posted in Design - Project83 - Showcase - Join the Discussion
Nov 05, 2009
An extremely important part of the web design process is wireframing. It involves taking all of the specs, notes, creative briefs, content and so on, and finally putting them into one complete picture. Over the years we've tried all kinds of different tools and techniques, but have more recently settled on a process that works great.
Every project I work on starts with a Sharpie and a piece of paper. It's cheap, low-tech and fast. In a couple of minutes I have some ideas on paper to work with. Once it's full, I start over and try to make a better one. Sometimes we'll go into the design process with 2-3 home page wireframe designs just to see what sticks.
Why a Sharpie (Fine Tip) and not a pen or pencil? They are less specific and they fill the page faster. Sharpie's force you to get creative with space and make room for only what is most important. It's not possible to get too wordy or carried away with a Sharpie.
Another benefit of paper wireframes is that there is no learning curve. Anyone can read or create a wireframe without having to learn anything new. When working with people of all different technical abilities, paper puts everyone on the same level and forces focus on the important stuff.
Here are a few examples from projects we have done:
I've done a lot of research trying to find the perfect wireframing sketchbook. Without a doubt it is the Dot Grid Book. This notebook is super-functional, well designed and great quality, making it an ideal geek tool. It's a pleasure to use.
This notebook is double spiral-bound with 80lb, perforated paper. It's easy to scan everything in when finished and keep it on my computer for further reference. It also handles the Sharpie marker bleed through to the other side of the paper pretty well.
Although we believe it's best to wait as long as possible to worry about specifics of a design, eventually it comes time to take wireframes further. I recommend a couple of tools for making pretty digital wireframes:
Posted in Design - Project83 - Web - Join the Discussion
Oct 13, 2009
A couple of years ago I wrote a post outlining many of the tools we are using to run the business, work with clients and build websites. Of course a lot has changed since then. I'm always interested in what others are using, so hopefully some of you folks can benefit from this updated list.
By far my favorite app, the one that's most crucial to our work every day, is Dropbox. It stores all my files securely online, keeps backups and previous versions automatically, syncs everything across computers and even on my iPhone, allows me to share files and folders with my partners and does it all incredibly well without getting in the way.
1Password is a useful application for keeping track of your logins/passwords. It makes great use of browser plug-ins to add new logins and sign you in quickly to sites it knows about.
This SSB (site-specific browser) allows you to use web apps like desktop apps, giving them a separate icon in your applications folder so it works independently of other apps. It's great to use for your favorite web apps.
This is the best document scanner you will ever own. It's so awesome that I got the small version for home and highly recommend both.
This app is incredibly useful when you need to find a hex value fast.
Very handy application for taking photos and videos of your screen
All our wireframes start with a blank sheet of paper and a sharpie! I recommend the Dot Grid Book for sketching.
I create sitemaps using OmniGraffle, and sometimes wireframes if the project demands it. However, we prefer not to get more specific than the paper/sharpie method whenever possible.
We use Fireworks, Illustrator, InDesign, Photoshop and the Media Encoder regularly.
Text editor that's fantastic for coding, and I also prefer to blog/write using it
I recently started using this super cool bundle that makes writing HTML and CSS 100% faster using abbreviations and snippets. This article should get you started.
This is a free tool for comparing files and finding differences between the them.
Great FTP client, easy and reliable
Beautifully designed subversion client, love it
Great little open source instant messaging client that supports any well-known provider (AIM, Yahoo, gTalk, etc.)
Skype is a swell app for VOIP phone calls and chat
They are not perfect, but I prefer the default OSX tools for email, calendar and contacts. I especially love the Letterbox Plug-in for mail.
CoTweet is great for companies that have numerous people managing one twitter account.
Great twitter client, beautiful UI for both the Mac and iPhone
We use this as a conference call number and also for client demos of all sorts.
This is a nice little application to schedule tweets for the future.
I store all kinds of notes in this program, along with categorized bookmarks. If I don't know of a place to put or remember something, it goes in Evernote.
EVERY task goes through this app, as I swear by the GTD methodology.
Great paper tool for taking notes in meetings and so forth
All our time tracking and invoicing takes place in this app. The clincher for us is creative control over the template design using HTML/CSS.
I'm looking for a reason to ditch Quickbooks, so I am not going to link it up here. It's just tough to find a system that is CPA-friendly and has the advanced features we use.
All recurring and credit/debit card billing goes through this system. It's primarily built for hosting providers, but we know the developers of this software and enjoy using it.
THE web developer tool of choice!
Great firebug extension that helps developers optimize pages for speed, according to Yahoo's best practices
Another firebug extension that is great for optimizing and measuring web page loading time
If you use Google Reader, Feedly is a sweet little tool that structures your feeds more like a newspaper. Sometimes I prefer using this instead of the reader interface. Cool idea!
Simple little tool to measure the pixels on a web page
Neat tool for taking a full page screenshot, no matter how long the web page is
Sync your bookmarks across browsers and computers, or even view them online
Lots of very useful tools for analyzing and building websites
This is a truly awesome tool where you can watch videos of people using your website and see very useful analytics. It's a great form of user testing because it is cheap and users don't know they are being monitored.
A great way to visualize how visitors are interacting with individual pages on your website
Comprehensive tool for doing A/B or multi-variate testing on your website
Definitely the most popular analytics platform, and you can't argue with the price
Uptime and performance monitoring, which notifies us immediately via email and/or SMS the moment anything is funky on one of our servers
Our team created Linkpatch, and we use it to watch for broken links on our websites. If someone encounters a broken link on the website, we get an email with all the information necessary to fix the problem.
We recommend this service to ALL our clients for email newsletters and marketing, they rock
Really useful feed reader
We created Feed My Inbox, which you can use to subscribe via email to any feed. It's very handy for people that don't use feed readers and want an easy way to follow their favorite sites.
I've never owned a fax machine, so this application gives me a number by which I can easily send/receive faxes via email.
My very favorite way to conduct online surveys
Automatically organizes your trip itenerary
Posted in Project83 - Reviews - Software - Join the Discussion
Oct 06, 2009
What do your clients say about you when you are not around? Never mind the one-on-one communication ... what do your clients REALLY think of you? What are they telling others about your company?
Does the thought of this make you a little nervous? If you care about building a successful business on the web or anywhere else, this is the kind of feedback you need from clients on a regular basis. Our little company depends solely on referrals for our business, so if our clients are not raving, our phones aren't ringing!
Often times we think of surveys when doing website testing or helping a client implement new features. Just as they are effective at gathering feedback for those uses, surveys are also a powerful way to hear what your clients are thinking, but may not be willing to say. If you come up with good questions, it is also guaranteed to point out things you can do better.
So early this year, I swallowed my pride and got in touch with every person we worked with over the last two years. I asked them to participate in our first annual client survey. All responses were completely anonymous and confidential. The survey consisted of 34 total questions. Most of them were multiple choice (rate from 1-5), and some were open-ended requesting specific feedback.
After all was said and done, about 35% of our clients filled it out. Each of our 1-5 rating questions (5 being the best) got either a 4 or 5 over 85% of the time, which I was very pleased with. Some questions had too many 2's and 3's, and I am now much more aware that we have to do better on those things. Either way, the 1-5 rating questions were a great way to observe overall client satisfaction with a solid number.
I'm really glad each section of our survey also had a text box for specific comments or feedback. I went through and read every single comment. Some of them were encouraging, and some of them were downright mean. Read them with an open mind and "customer is always right" mindset, which means making excuses is a waste of time. Just do better! The best responses included helpful suggestions, which we immediately implemented as part of our business.
Overall, I am so glad we went through with the client survey. We found some things we can do better, and probably never would have known about without the survey. We also set a benchmark, which is something we can look to improve on in coming years.
For our survey we used http://www.survs.com. They just launched their service publicly, and I had an incredibly positive experience using it. I have also heard nice things about http://www.surveymonkey.com. It's ugly, but is the current industry leader and seems to have additional features.
To view a copy of our survey in full, check out this page: project83.com/survey.
Posted in Business - Project83 - Join the Discussion
Jul 15, 2009
The process of estimating time in our business is broken. At most, we typically have a document of basic requirements, alongside a few calls with the client to go over questions about a project. In turn, we are expected to provide a budget/timeline and stick to it for what can easily be 3-6 months or more.
For many projects this is enough, but for larger or more custom work, estimates in many ways are just a shot in the dark. The process is often inaccurate and risky. It's like remodeling a house. The project often takes longer and costs more than you originally planned. Since we're committed to meeting both the timeline and budget, there are times when an inaccurate estimate can present a bit of a pickle.
An incorrect estimate isn't good for anyone. Overestimating isn't in the client's best interest and can keep you from getting the project, but underestimating almost ensures that the project will not promise to be your best work and it can be very frustrating for both sides. Ick.
Recently we have begun suggesting a paid "exploratory" period (needs a cool name). We spend all the time necessary to define a clear project scope, write out written requirements and estimate the time needed to complete the project. An accurate quote can easily take at least a few days when done properly, and it is only fair to be compensated for that kind of time.
Since the client pays for the time, they own the work that we do to define the scope and create written requirements. That way, getting bids from other companies should not only be easier, but all the bids should be more realistic.
Another benefit of paid exploratory periods is being able to partner with a client/company before diving in head first. It is very important for both sides to get to know each other, and get a good feel for what it's like to communicate together. If it does not work out, you can look elsewhere without being empty handed.
We don't do this on many projects, but it is extremely helpful for some. Here is a list of questions I consider when deciding whether the project needs further exploration:
I'm definitely most comfortable with this approach right now, but it took nearly 4 years to figure it out. I believe it is perfectly reasonable to ask for compensation if it will take a significant amount of time to provide an accurate bid on a project. If you can master the art of pricing and estimates in web development, you are on your way to building a very successful business.
For additional thoughts and ideas on estimating time as a web designer/developer, our friends at Smashing Magazine published a very informative article about it.
Posted in Business - Project83 - Web - Join the Discussion
May 05, 2009
Imagine for a moment that you are engaged to be married. One very important decision you have to make is choosing a photographer for the wedding and reception. Photographers can easily cost $2,000 and up, so you want to be sure about your choice.
You are having a tough time making a decision, so you invite five photographers to participate in your wedding. There is only one caveat: once the wedding is over, you will review the all photographs, and choose the one photographer you like best and only pay that person. The other four get a friendly handshake and nothing more for their hard work.
This is the concept behind what people in the design world refer to as "spec work". It's been quite a hot topic as of late. Entire websites (this one too) are now dedicated to helping companies find designers willing to do spec work, and basically compete for the right to work with a client on their project. We have gotten inquiries about doing spec work at least twice already this year, so I feel like it is important to explain why we don't participate.
One of the criteria that must be met before we take on a project is answering YES to the following question: "Can we do really great work?" Our very best design work is the result of seamless collaboration with the client, extensive research and careful planning before ever getting started on the visual design. With spec work, this part of the process is often cut short or ignored all together.
By choosing a design created on spec, it gives too much weight to the visual side, instead of what will perform best with customers or help grow your business. The visual part of a site is only one piece of the puzzle, but with spec it is often the only piece of the puzzle considered by the client upfront.
We enjoy the process of creating a user-friendly, effective website; but that process takes a lot of time and effort. It's simply not feasible to do it all for free, with no guarantees of getting paid for it eventually.
Whether spec makes sense for you as a client is all about what you hope to achieve with the design. If one or more of the following characteristics describe you, it's possible that it will be a good fit:
I personally think it's wrong to expect any professional to perform 10-25 hours of service free of charge without any guarantees. But plenty of creatives are totally okay with it! If you are a designer, and use spec work as an opportunity to prove yourself and get better, then make the most of it.
No matter what side of the fence you are on, it's important to respect those on the other side. Some of that has been lost in all of this banter across the web. We spend a ton of time on all our projects and really dedicate to the process, so spec does not make financial sense for us or the clients we work with. However, for those that can make it work and are proud of the results, more power to you!
Posted in Design - Project83 - Join the Discussion
Apr 29, 2009
We had the great pleasure of launching a number of projects over the course of April, and three of them recently landed in our portfolio.
Visit this site in a new window
Read about the project
Visit this site in a new window
Read about the project
Visit this site in a new window
Read about the project
Posted in Design - Project83 - Showcase - Join the Discussion
Apr 16, 2009
A thrilled customer is the biggest WIN a company can have in my opinion. Happy customers can single-handedly keep you in business, and outlasting any challenges a recession or struggling industry may bring about. For Project83, our customers are everything, considering we have yet to spend our first dime on marketing (and don't plan to).
That said, providing an outstanding customer experience in our business (web design and development) takes work—a LOT of work. It's something I was severely under-prepared for in starting this company, and I definitely have room to get better; even after nearly four years of learning.
If you are considering a career in web design or already have one, I feel it's important to be aware of what it takes to WOW a client over the course of a project.
When you typically think about customer service, it's a sprint. Purchasing a product in a store, going to a restaurant, or calling a 1-800 number are all forms of customer service that begin and end in a short span of time, thus the reason I call them sprints.
A typical web design project is very different. It's a marathon. It can easily take 3-6 months of work to provide one single outstanding customer experience to a client. That also means you have six months to screw it up.
My advice? Be patient, communicate constantly, take responsibility for mistakes and meet the deadlines you set. Do those things and you've already surpassed most companies in our business.
By providing a creative service, literally nothing we do is black and white. It's all up for debate until you have analytics to back up your theories. All of our work is subjective, and in the end the client has final say on which direction the project goes. If we believe a project is perfect, yet the client believes it's not close, then it's not close. Sometimes that can be a hard pill to swallow.
Consider creative differences as a challenge for you to get better, and to get out of your comfort zone. At times we simply have to trust that our clients understand their business better than we do, and just make what they want happen. At other times you should be honest and try to steer them in another direction. It's a delicate balance, but always make your points with respect, and be willing to move on if they don't agree with you.
Web development is still like any other business in that it revolves around people. Due to the long-term nature of a web project, you are expected to initiate and maintain a great working relationship with the people that hired you, or else things can go downhill. If you are an unbelievable designer with bad people skills, it's virtually impossible to make your customers happy, despite the work being good.
My advice is not to be a hermit (I can struggle with this). Seriously, don't lean solely on email communication with clients. Check-in with them on a regular basis over the phone or in person to keep your relationship on good positive terms. Email can be so easily misinterpreted and cold, that you simply must do more to keep your relationship with a client on solid footing.
As a matter of personal pride, it is perfectly natural to want each project you work on to be your very best. But that won't always happen, and you have to be able to smile through it.
Web design work is about honoring the client, and providing a product for them that will generate a great return on investment. Most importantly, you want them to have a big smile and tell all their friends about the great experience they had working with you. Do that and everyone wins. Make the project about you or your ego and you will lose most of the time.
I am not writing this post because we have the customer service thing down; because we don't. However, I do think we're getting better at it every day. Being conscious of common pitfalls in our business is the first step in rocking them out and providing outstanding customer service.
Posted in Business - Design - Project83 - Join the Discussion
Mar 03, 2009
It has been about a month since we launched the latest version of Project83.com, and I have been pleasantly surprised by all the great feedback we have been getting.
Version 3 of the website is certainly something we are proud of internally. I feel it is a great representation of who we are and what we value as a company. We have grown a lot in 3.5 years, and it is cool to look back on versions one and two of the site to see how far we have come.
I wanted to spend a little time walking you through the process that got us here, which runs over seven months. Hopefully it will encourage or challenge you in some way:
I never asked for or desired a new logo for Project83. However, I could not be happier with how it ended up. Lesson #1: only great things can result from giving your design team (in my case, Jared) complete creative freedom.
The typography got a well-deserved update. We moved to all caps ("J" sure is a weird letter), changed the font and gave the letters a little breathing room. The new mark is much more relevant, and the colors are much less distracting now. The website matured a great deal in version 3, and it all started with the logo.
Leaders in our industry have mastered the "less is more" approach to web design. As our team continues to learn more each day, we get better at doing less and making the most of it. Each version of our site has been no exception; less design, less code, less content and fewer overall distractions.
Thankfully, Project83.com finally runs 100% on our content management system called Springboard. Adding new portfolio items, writing blog posts and updating content has never been easier. Whew!
Especially when it's your own site, you have to do everything possible to make sure it is quick and easy to make updates. Otherwise, you simply will not get to them as often as you should. Find a content management platform you love (if you don't have one try ours!) and make sure to update content regularly.
The website copy probably went through at least 15 revisions. This is the first version of our site that I believe was truly built around the copy, which is the way it should be. The site has fewer words than previous versions, yet speaks to our target audience more clearly and persuasively than ever.
I can't overstate the value of spending time on your website copy — and the value of having a little fun with it! It's something I preach every day, but it really hit home in working on this new design. Without quality content, the best designs in the world don't work.
Keep in mind that good content takes time. You won't get it right the first or second or fifth time. Keep at it, and I believe it will prove to be absolutely worthwhile in the end.
I hope you like the new design ... we appreciate your feedback!
Posted in Design - Project83 - Web - Join the Discussion
Feb 02, 2009
After a ton of work, I am excited to announce the launch of Project83.com v3. A much longer post about the site and the various design/branding decisions we made is in the works. For now, just give it a look and feel free to share your thoughts!
Posted in Project83 - Join the Discussion