All Posts, Web Design, Web Development
I think its safe to say that each designer has their own way of doing things. When it comes to how to start a new web design project, there are quite a few ways to get started. I’m not going to say that any one way is right or wrong, but each direction does have its own benefits and trials. For example some starting points may take way more time then they need to and delay the actual development process. While others are have too much of a shotgun approach and may leave you doing more cleanup in the long run then necessary had there been more planning at the beginning.
Let me start off with the way we at Design Theory get started with a new web project. Again, no way is right or wrong, this is just a transparent look into our world.
1. Wire frame: Once your contract is signed and a deposit is paid, our graphic design team starts designing a mock home page. Depending on what the client’s needs and requests are, most layouts are pretty standard. We start off with a wire frame of boxes and rectangles as placeholders for content and images. Logo here, banner there, ads here, text and content here, images there. Once this is created for both the home page and at least one sub page, it will be passed on to the client for approval and signing. We don’t move forward unless we get a signed copy back.
2. Designing the Mock-Up: This part is a little fun because you’ll start to bring in some colors and realistic elements using Fireworks or Photoshop. Any design app that allows you to use layers. Then head over to Lipsum to grab some text filler for page body areas. Use the company logo and position it where you think it will best fit. Try some page backgrounds or menu colors and boarders to see how much more live the design looks. You may also want to design a few other sub page variations as well as the contact us page here too. Again, you’ll send this phase to the client for approval and signing.
3. Slicing: Some call this PSD to HTML, but the concept basically is cutting up all those layers and graphical elements from your design into individual graphic files. For example, the logo will now be saved as its own file with a transparent background, and so will the banner, and the menu boxes minus the text. Slice the navigation bar into buttons or formulate a working htm file for dropdown and linking functionality. You’re pretty much breaking down every part of your design to prep the development team to build the site.
4. Development: This is the fun part. Depending on whether or not your a coder I should say. At this stage you’ve got all the right elements sized or scaled to what they’re supposed to be. The functionality of menus and widgets have been explained and demonstrated so you can do everything you need to in a timely manor without any more interaction from the client. During the build process, you’ll also be checking for browser compatibility, what is actually see above the fold, font sizing, CSS, and overall flow of the each page.
5. Double-Checking: Hopefully at this point there are a fresh set of eyes overlooking the project. Check for broken or incorrect links, image alt tags, site map, spelling, grammar, lines and balance and attention to detail. Within our design firm we’re happy to have a content writer who’s not afraid to pick and tear apart our sites during development for inconsistencies and errors where we may have ignored or missed along the way. (Thanks Yvonne!) After this step is when you’ll want to present a semi-polished preview to your client. Having your ducks in a row will save your client from noticing small errors and focusing on the big picture. In my experience this stage is rather crucial because if you can’t get them to focus on the overall design and functionality, they’ll run you crazy on the minor imperfections that you can probably fix just as fast as they find them while on the phone.
That’s a brief run-down of what we do at our design firm. I hope this is helpful to you. If you have another way on how you start your design projects, please share in the comments below!
Web Design
Do you have difficulty getting visitors to come to your website?
The first thought that may go through your mind is that you’re not marketing enough, but you may be overlooking a common problem. Most people who do a search on Google.com don’t spend very much time deciding whether the website they clicked on is where they want to be. Typically, the decision to stay or go will happen within 7 seconds, which is commonly known as the 7 second rule. To ensure visitors are staying on your website after those first 7 seconds your website needs to have:
1. Easily accessible information
2. A user-friendy layout (clear and concise navigation)
3. An attractive design
Here are some examples of websites that DO NOT provide users with these three important design concepts:
Serene-Naturist.com
This website has so many design no-nos, I don’t even know where to begin! First off, all of the extra graphics, such as the butterflies, really distract you from what the website is really about. Secondly, the design does not look professional at all, giving it the impression that it was made by a 10 year old. You definitely don’t want that if you’re going to run a professional business. Also, the page loads very slowly because of the plethora of images and moving graphics that are completely unnecessary.
ChesterTourist.com
This website suffers from what I call “information overload.” The user doesn’t know where to click. There are just way too many links that are placed everywhere and not organized. This website would be a lot easier to navigate if the designer had grouped the links into categories and displayed them in one menu (e.g., a drop down menu).
Those were examples of BAD website design. Here are some examples of GOOD website design:
First Church of the Living God
This website is one of our own (created by the Design Theory team) and highlights some very good aspects of design. Unlike ChesterTourist.com, the navigation is very clear and concise. If you hover over the links on the navigation bar near the top you will see how much easier the website is to navigate with the links grouped into categories and displayed in a drop-down menu, which is what ChesterTourist.com should have done with their links. As you can see, the website is clearly about a church and the information (our services, media, events, etc.) is easily accessible and presented in an attractive, easy-to-read format.
Preston Dental Care
This is another website that we (the Design Theory team) have designed. Again, the navigation is very clear and concise, and easy-to-read. If you want to find out more about what services Preston Dental Care offers, the link for “Services” is right in front of you in large letters.
A very simple, easy-to-read layout is very important for getting more users to come to your website. I think the worst thing you can do is confuse the user. Your business may have the best product or service in the world, but if you don’t present it in a way that is easily accessible on your website, you will have a lot of trouble getting new customers.
Check out our design portfolio if you want to see more examples of GOOD designs 🙂
What about you? Have you seen any websites recently that you loved, or maybe some you wish you hadn’t seen?
All Posts
For those outside the marketing realm, let me help define “branding”. Branding is a signature ‘look and feel’ that leverages all of the resources our industry has to offer to make sure that you will be noticed and recognized by consumers and like industry companies.
- Branding is an essential component to any business therefore it’s something you should consistently think about and ensure it evolves on an ongoing basis. Taking time to think about and employ opportunities to promote your brand is both fundamental and key to its success.
- Your brand and marketing materials should precisely detail & sell your product and/or service. If they’re not, they’re wrong. You know the old adage of “if it isn’t broke don’t fix it”…well if it is, it’s time to re-think and re-brand.
- C’mon, get focused! Your view of your product/service can sometimes be narrow and if it’s your “baby”, it can be hard to be a tough critic. So if you can’t afford to pay for a professional focus group, here is a suggestion. Get together a group of professional friends from various industries and present your products/service. Offering hors d’oeuvres and beverages is a nice form of compensation. What’s most important though is getting their feedback in writing and implementing their suggestions (if they are good ideas…) into your brand/marketing strategies and promotions.
- Know your street credibility ~ Your brand image as well as its reputation is vital. It’s super important you know what your client base is saying about you…and even your competition. Being armed with this information will allow you to evolve your branding & marketing strategies to thwart the effects of the good or bad press.
- Promote your brand across all landscapes. This should include at a minimum:
∞ direct marketing via mailers;
∞ email campaigns and promotions;
∞ online & in-store promotions; and last but surely not least…
∞ social media, etc.
Web Design
If you pick up a newspaper or read articles online you’ll easily find articles of companies and industries talking about fiscal performance from last quarter, or last year, or last month to now. One of the main things that big companies keep their eyes on is their money. Money that they take a lot of time forecasting how much they’ll make from day-to-day, week to week, and so on. I even believe that this is their number one priority and what they spend most of their waking business hours contemplating. This is because they are rated or graded by their track history or performance. Now what about you? Let me explain.
I don’t need to go over why every business needs a website. Been there done that. I also don’t need to explain how more and more people are losing their jobs and careers and NOT sitting around waiting for a new one – but instead becoming entrepreneurs and small business start-ups. I’m even not going to ask you if you think we’re in another dot-com era, or how mobile apps will be even more vital to a business in the next few years. What I am going to tell you is that as a designer (albeit web, graphic, programming, whatever) your market is only going to continue to grow. All of these people are entering your market in droves all across the country. They need business cards, logos, web sites, letter heads, and corporate identities, and they need all of that yesterday. Sure there are numbers about there that suggest most start-ups don’t last more than 5 years before they fail, but I think even that’s going to change due to there being not many other options past “plan b.”
All of these new businesses have something collectively that major businesses forgot. Customer service. I’m sure you don’t have to think back too long when you last had to call an 800 number and got someone who could less about you, hung up on you after you explained what help you needed, or couldn’t understand what you were saying past the script they need to read you. As a small business, all of these “corporate” gripes are remedied when consumers look towards their local providers. They get:
- Immediate customer support
- Local phone number to someone they probably already met in person
- A physical location to get products or services
- A pleasant customer experience that will be praised to all of their friends
As a designer, you can provide all of that and more with almost little effort than a good attitude and work ethic. Good work is good, but great customer care goes so much further. Especially in a world where a customer’s bad experience can be Tweeted or Facebook’d online for all the world to see. Don’t forget that those posts never come down. As long as you have a solid business plan, have a good work-flow, and know how to treat each of your clients like they’re your only one, you’ll survive this recession and plenty years after.
All Posts, Web Design
I’ve been in business for over 10 years as a freelancer and start-up owner. My first business was computer repair and maintenance. I learned early off with that business that the key to being successful was how I interacted with my clients. I’d get calls with questions about how they got a virus to why was their computer working fine the day before but not today. The one thing that had to remain the same was my level of patience to explain to them in layman’s terms, what the problem really is. This tactic didn’t change when I moved into designing web pages and graphics.
I had to say this, but most people who say they want a website, really have no idea what type of website they’re looking for. I’m not even going to get into the argument on whether or not they need one. Lets just focus on some key elements that may save you some headache in the terms off your website project as it progresses.
- Explaining all the elements and content you need from the client for their project to be started and completed. This usually starts out as a “no problem” from the client. Somehow it turns into a 3 month volcano because they’re dragging their feet yet pressing you for a launch date.
- Have them understand exactly how many times they can order a redesign without being charged, and what a “re-design” actually means. In most contracts that I’ve seen, a client is only allowed 2 revisions. Once they cross that, they’re supposed to be charged. However they don’t fully understand what a revision may be. Asking for a font change and color change in one email constitutes a revision.
- Fees and payment schedules. If you have a signed agreement for how your project is going to go, stick with it and constantly remind the client of upcoming fees. Otherwise they may resent you for the unseen charges, even though they clearly signed in 3 different sections of your agreement.
- Problems and setbacks. They don’t need to hear techno-babble. Explaining to them that the images they gave you were too large to fit due to pixels or file types makes no sense to them. And trying to explain why your coding looks great in Firefox but won’t accurately line up in IE or a mobile browser has to be explained with care.
- What exactly YOU do. If you’re just a graphic designer, don’t get wrapped into a project that started out as a logo project that turned into a website redesign project – and you’re not a web designer. Main reason is because you won’t be paid for what you’re doing extra, and second you could risk damaging some other work that in the end will cost you your own time and money to restore.
For me, my very first client was this post’s learning experience. I went through just about all the examples above, got paid very little, and frustrated a heck of a lot. I’d love to hear your experiences!
