User Interface and Web Designer. Designing clean, professional websites and logos to serve all needs.

 09/2006 - NewWebPick  09/2006 - Bronze Mowsnet Web Award Award  09/2006 - Spy Line  09/2006 - lovetatoo  09/2006 - internetvibes  09/2006 - netculture  09/2006 - My Design Award  09/2006 - Design Firms  e-motion Award  Linkas Design Award - Web de Plata Award

Tel: +20101011527

Previous Posts



Powered by Blogger

Add to Technorati Favorites

Subscribe to
Posts [Atom]

Web Design Logos Print Photography Blog

Sunday, February 3, 2008

8 Web Design Mistakes That Developers Make


An excellent website takes a particularly savvy blend of both great design and great code. Because of this, you often find designers having to figure out code and developers trying their hand at design. Speaking as a developer who spent his university years studying among other developers, I can safely say that programmers are not designers. Thankfully, we were graded back then for having reusable code and proper OO methodology -- never for our aesthetics. But nowadays, one of the greatest assets a developer can have is a keen understanding of design.

Now I understand that a programmer may never need to know anything about design (or for that matter, a designer doesn't ever need to program). But the truth is, every programmer has personal projects, frugal clients, or management roles that require design. Furthermore, I can say that often, a freelancer's greatest asset in pitching potential clients is their keen understanding of the entire website building process. So coming from someone who studied as a developer but now also does design (or at least attempts to), here are 8 mistakes I've either heard or made myself.

"I Know What Looks Good (and I Have Photoshop)"
It's one thing to be a bad designer. It's a far worse matter to be a bad designer and think that you're good. Every good designer has a well-calibrated "design compass" that comes from constantly looking at good designs. You need to spend time looking at great designs from sites like TheFWA, FaveUp, Design is Kinky, and my personal favorite, the Behance Network. You might also want to pick up the occasional design magazine like HOW or print (note that both are U.S. magazines and may be more expensive internationally). Just as good programmers enjoy looking at (and usually critiquing) other people's code, a good designer is always scanning other people's work, whether it be a website or billboard or menu. Without a good "design compass," no amount of Photoshop filters will save you.

"Just Use Blue and White Again"
Most programmers scoff at the idea that a designer might spend several hours choosing exact colors for a website. However, colors will always matter more than you think and you can't change them after a site is being built (at least, not without great effort). Like most things, looking at the color schemes of good designers will help, and the best place to look for color scheme ideas is COLOURlovers.

"I'll Just Center Everything"
For most, it seems almost natural to center align titles, taglines, and parts of copy. But usually, centered text on a website looks amateurish, while left-aligning is a much safer and usually better looking option. Furthermore, be mathematically exact about your website sections, taking advantage of rulers and gridlines in Photoshop. This doesn't mean your design should look grid-like, but eyes can and will notice when sections are supposed to line up, but do not (especially with text). Every pixel matters.

Helvetica and Arial"Use the Free Font...It Looks Fine to Me"
There was a time in my life when (a) all serif fonts looked the same and (b) no font was worth paying for. I have since rescinded on both, and continue to learn more about the complex and beautiful world of typography. Honestly, if there was one subject I wish I could master, it would be typography. You can have a great website with only a little color and great type (and such is the basis for any great design anyways). Again, becoming better at typography requires reading and training your eye by looking at good sites. And please never categorize all fonts under either "fun" or "boring."

"We Can Fit More Information in That Space"
Having worked on both programming and design teams, a common disagreement between the two is "utility of space." Programmers want to get as much information above the fold as possible. Designers argue that the eye can't take that much and would rather just have a logo and tagline above the fold. Try finding a happy median between the two, knowing that (a) busy websites can be ineffective, (b) "whitespace" is not just a fallback for lazy designers, and (c) the so-called "empty" portions of a site are necessary to set off the other elements.

iStockPhoto is Good"I'm Not Paying for a Picture"
Bad imagery/photography can ruin a reasonable site, while great imagery can make a simple design look really good. And with the resources on the web, there should be no excuse for using poor imagery. For non-commercial sites, check out stock.xchng or Flickr -- just make sure that the license behind the photo allows its use. For commercial work, there are multiple microstock websites out there like iStockPhoto (although learn to be creative because after a while, you start seeing the same images on other sites). And lastly, don't be scared to spend good money for the perfect image at a site like Veer.

"I Don't Need to Ask for Opinions"
More often than not, you will be your design's biggest fan (through your rose-colored glasses). So you need to ask designers you know for an honest critique. Unfortunately, most people I know who've asked me what I think of their design just wanted approval, not critique. So let your ego go and put on your learning cap. There's a reason that these people are designers (and get paid for it) while you are not. Then after you get their feedback, respect them, trust them, and implement some changes.

PSDtuts"No Need to Get Too Detailed"
Just like you can have mediocre code that needs improvement (but still "works"), you can have a design that is passable, but far from great. It's easy to look at great designs and think, "That doesn't look like much." But in reality, a great design takes a good deal of time (especially for new designers). But with these great designs, you only get to see the end product, and not the amount of editing and revisions that the designer went through. Furthermore, you'd be surprised how a detail as simple as a stroke line makes a world of difference. Don't ever consider a design "done" the first time you put the elements together.

All in all, great design (like great code) takes time, patience, and skill -- and thus, should be duly respected. Although as a programmer or content writer or other web worker, you may never need to design a website, I have a feeling that at one point or another, you'll have to anyways. Hopefully, you won't make the above mistakes...
StumbleUpon Toolbar

Thursday, January 3, 2008

Time Picks the 50 Best Websites of 2007


It’s that time, no pun intended, that every on and offline publication does its best & worst look back at the now-previous year.

Time Magazine takes a look at what it believes are the 50 best websites of 2007.

A number of sites made the cut in the “web services” category:

Personally, I’m shocked they missed Meebo, and I’m grateful there’s nary a Facebook app in the mix.

StumbleUpon Toolbar

Wednesday, January 2, 2008

Top 10 (Web Safe) Blogging Fonts


The definition of Web Safe fonts means that they are generic fonts that work throughout (most) Web Browsers and are used on all operating systems (Windows, Linux and Mac). So if you design web pages on any of these sytems or use any browser then they will be displayed the exact same. Of course, nothing is as easy as saying that Comic Sans works across all, the reality is, with Safari, that Bold doesn’t display well. So we have to play it safe, we have a very small range of fonts to use, so we have to be creative with what we have.

Below are a list of the most commonly used fonts for Blogging and Web Design.

You can also download Web Safe fonts here.

Georgia Font
(CSS) Font-Family: “Georgia”, serif
Designed in 1993 by Matthew Carter for the Windows…read more on Wikipedia.

Arial Font
(CSS) Font-Family: “Arial”, Helvetica, sans-serif
The typeface was designed in 1982 by Robin Nicholas…read more on Wikipedia.

Courier New Font
(CSS) Font-Family: “Courier New”, Courier, monospace
The typeface was designed by Howard “Bud” Kettler in 1955…read more on Wikipedia.

Trebuchet Font
(CSS) Font-Family: “Trebuchet MS”, Helvetica, sans-serif
Designed by Vincent Connare for the Microsoft in 1996…read more on Wikipedia.

Lucida Console Font
(CSS) Font-Family: “Lucida Console”, Monaco, monospace
Designed by Charles Bigelow and Kris Holmes in 1985…read more on Wikipedia.

Verdana Font
(CSS) Font-Family: “Verdana”, Geneva, sans-serif
Designed by Matthew Carter for Microsoft…read more on Wikipedia.

Times New Roman Font
(CSS) Font-Family: “Times New Roman”, Times, serif
Designed by Stanley Morison in 1931…read more on Wikipedia.

Lucida Unicode Font
(CSS) Font-Family: “Lucida Sans Unicode”, Lucida Grande, sans-serif
It was developed by Charles Bigelow & Kris Holmes in 1993…read more on Wikipedia.

Tahoma Font
(CSS) Font-Family: “Tahoma”, Geneva, sans-serif
Designed by Matthew Carter for the Microsoft Corporation in 1994…read more on Wikipedia.

Impact Font
(CSS) Font-Family: “Impact”, Charcoal, sans-serif
designed by Geoffrey Lee in 1965…read more on Wikipedia.

StumbleUpon Toolbar

Tuesday, January 1, 2008

How to Gain/Lose a customer in 10 seconds

Source: Doha Shawki

Customer service is extremely critical and requires attention to the smallest details. A customer service manager must realize that his job is more difficult than any other manager because he has to monitor his team very closely every day. He also has to know how to motivate his team and create a spirit that helps them delight your customers.

He also has to make sure he wins back any angry customer because of any mistake done by his team. The smallest actions can either help you gain customer loyalty or on the other hand drive your customers away. And as we all know, one angry customer can make you loose from 8 to 10 other potential customers. With a simple calculation make two customers only angry and you will automatically lose around 20 customers! That is a risk no one is ready to take.
Below I will mention some real life examples of how the smallest actions can make you Gain / Lose your customer and practically in a matter of seconds.

Bad Examples

I will start with the bad examples “How to lose a customer in ten seconds”

  1. chilis.jpgOnce I went to eat at Chili’s and my husband called for the waiter to come and take our order. As he was on his way to our table, the customer in the table next to us called for him, so he shifted to his table and got what he asked for first and then came back to us. When my husband commented that we called for him first so he was supposed to serve us first, his answer was ridiculous, he said:”he is already eating and he just wants something to complete his meal”. He did not even bother to apologize. Not only that, but in the same day they brought me the glass of juice I ordered in a glass with part of its tip broken. I took a picture of it to show it in the post!
  2. Starbucks again! I went there once and asked about the brewed coffee of the day. They wrote that it has ginger and orange flavor. I asked if it can be served without the orange and ginger flavor, and I took the most sarcastic look I ever saw in my life from the waiter and he laughed sarcastically and said: ”No, we do not add the flavor, the flavor is in the coffee beans itself” I felt he wanted to tell me: you are so ignorant. My husband asked for the shift manager and we told him what happened. He said we are sorry and gave me a paper to write my comments on the service and said that it will reach the café management. I am not sure if it will really reach them or not but I filled it anyway!
  3. I went once to Trianon in City Center. I can’t remember exactly the name of the platter, but it was a chocolate cake with Ice cream. Both I and my husband ordered the same thing and we asked for the ice cream scoop on it to be chocolate. They brought us the two plates with Vanilla ice cream!! And when we said we asked for chocolate ice cream, the waiter did not even bother to apologize and he did not even listen well, as he took one plate only and changed it and left the other!. Not only that but he brought me an unclean fork to eat with. And again when I asked him to change it, he did not apologize, he just took it and brought me another one. And I am sure he will not report the incident to the shift manager to make sure the responsible person gets punished.

Many examples and all boil down to one thing, it is very difficult to gain a customer but extremely easy to lose one!

Good Examples

Below on the other hand are a couple of good examples where employees served their customer very well.

  1. My husband was buying some things from a nearby pharmacy. He asked for a certain type of Cerelac for our child but they told him they ran out of it. The man in the pharmacy took our phone number and told my husband that he will call once he has it. Later at night, he called and said that he has it, but it was late so I asked him to bring it in the morning. I was sure they will not send it and I will have to call to ask for it. But the next day I was surprised to receive a phone call from the pharmacy asking if I still want it and whether to send it! I was so happy to find that there is someone in Egypt who understands the true meaning of customer service.
  2. badr_ayad.jpgI went to Starbucks once and wanted to understand the difference between the different types of coffee beans they sell to buy a packet for my mother. The waiter who served me was extremely helpful; he explained all types in details. He explained also the difference between the different ways of grinding. I told him I wanted it to be closest to the Turkish coffee people drink, so he recommended one type to me. Then he explained how he can grind it for me, the Turkish way to make it suitable for a Turkish cup of coffee. Even after I made up my mind and bought the coffee pack and he grinded it for me, he explained to me that it has to be kept in its pack to stay fresh. He showed me something like a button in the pack that works on sucking away the carbon dioxide from the pack to keep the coffee fresh. That was an extra step on his side, as I already bought the pack so he was not doing it to make me buy but he was serving me right. He was very helpful and answered all my questions without making me feel that I am asking too much. He made me feel that he loves his job and wants to make his customer happy so he does his best to please him. I was satisfied enough that I was interested to know his name and take his picture to put it here in the post.

It is really a matter of seconds and you can win or lose your customer. Even if you make a mistake and make your customer angry, if you start with an apology before saying anything else it will make a lot of difference. But if you start justifying your actions or act as if your customer is asking for too much, you will lose him.

If you want to delight your customers and win their loyalty you have to do not only your best but go the extra mile.

StumbleUpon Toolbar

Monday, December 31, 2007

4 Characteristics of User-Friendly Websites


A primary goal of any website or blog should be to provide its visitors with a pleasant and fulfilling experience. Regardless of what market the website is targeting, the opinions of users will play a huge role in determining the site’s level of success. Visitors that have positive experiences will be much more likely to come back later, refer friends, sign up for a newsletter, purchase a product, submit an inquiry about a service, etc.

When developing a website, the user’s wants and needs should always be in the forefront of the decision making process. It doesn’t matter what type of website you run, it needs to be user-focused. Unfortunately, sometimes it’s easy to get caught up in the design and development process and create a site that satisfies the designer or the owner but doesn’t really provide visitors with much value.

What makes a website user-friendly? There are probably an endless number of factors, but let’s look at five of the major ones.

1. Page Load Speed

Although high-speed internet connections are becoming more and more common, there is still a large number of internet users that are on slower dial-up connections. Even with high-speed connections some pages just don’t load very quickly. Most of your visitors will be fairly impatient and pages that load slowly could chase them away. At the very least, slow loading times will reduce the number of pages that they’ll visit on your site.

Knowing your site’s audience can really help to know how your pages should be designed. A program like Google Analytics will show you the percentage of your visitors that are using different internet connections. Based on the numbers you can get a good idea of what type of impact page load speed will have on your overall audience. If your site attracts a high percentage of users with dial-up connections, you should be sure to keep pages loading as quickly as possible. If a very high percentage of visitors are using high-speed connections, you may be able to add a few extra elements to your pages.

Factors that influence the load times of pages include the number and size of images, extra items like flash, the amount of excess code (example, designing with a table-based layout instead of CSS), and the size of your pages. (Read more about website optimization).

2. Accessibility

If someone can’t use or access your website it serves no purpose for that visitor. Accessibility of websites has become a bigger priority for designers and developers in recent years, but there is still a long way to go. Even major corporations have struggled to achieve complete accessibility. Target was even sued over the accessibility of its website for handicapped individuals.

Some of the easiest things that you can do to improve the accessibility of your site include using alt tags for all images, use valid HTML and CSS coding, avoid frames, and allow text to be re-sized by visitors. There is of course much more to accessibility, which was covered in detail by 456 Berea St.

3. Navigation

All users want to be able to move through the website to find what they want. A huge factor in being user-friendly is providing simple and intuitive navigation. Major areas of navigation should be located consistently on all pages. Using common elements that users expect to find, like About pages and Contact pages will help as most internet users have come to expect them and will look for them at times.

A general rule of thumb is that any page on your site should be reachable with 2 clicks from your home page. For larger sites this probably isn’t realistic, but offering a sitemap and/or a sitewide search can really help.

Another important factor with navigation is that user’s shouldn’t have to guess where they will end up if they click on a link. Regardless of whether the link is part of a navigation menu, or if it is simply in the body of the text, visitors should understand where the link will lead them.

4. Information

Visitors are coming to your site for a reason. Whatever that reason may be, you want to provide them with what they are seeking. Are they coming to find basic information on your business’ services? Are they coming to read in-depth articles on a particular subject? Whatever the case may be, the information that your website provides needs to sufficiently meet the expectations of visitors.

A blog like this one will need to provide its readers with great, insightful articles in order satisfy its visitors. The website of a restaurant may need to provide hours of operation and a menu in order satisfy its visitors. Obviously, each situation is different. In order to have a user-friendly website you need to anticipate what visitors will expect to find at your site, and then put it right in front of them.

I know this is just the tip of the iceberg on the subject of user-focused websites. What factors do you feel are important (either from the perspective of a visitor or a designer)?

StumbleUpon Toolbar

Sunday, December 30, 2007

2007 In Numbers: More People Using Yahoo Mail This Christmas Than Gmail


Email remains one of the most popular of online services. Companies such as Yahoo, AOL and Microsoft have offered free online email since the earliest days of the internet. Google was late the party, launching Gmail in April 2004. Where as Google has come to dominate many of the verticals it enters, email hasn’t been one of them. This Christmas many more people will be using Yahoo! Mail to send Christmas well wishes than will be using Gmail.


Statistically this is where tracking online email popularity becomes difficult. This year Microsoft has launched Windows Live Hotmail with users logging in via its various “Live” properties, making it difficult to place exactly how many users were logging in and using Live and Hotmail email addresses. In April comScore placed Hotmail at 47 million unique visitors. No figures were available from comScore on traffic (which includes search and related traffic as well) or Windows Live Mail, although sites such as hit 154,000 uniques in November and did 1.39 million. AOL remains a fairly popular choice for email as well, with comScore reporting 42.3 million uniques in April.

There are still no shortage of Gmail fans out there, but at its current growth rate Google wont be catching Yahoo! Mail until 2010. Yahoo showed 3.21% growth for the 12 months to November 2007 compared with Gmail’s 53.60%


StumbleUpon Toolbar

Top 10 Startups Worth Watching in 2008


Credit crunch? Recession risk? You'd never know it, judging by the frenzy of startup activity. In fact, it's a pretty good time to start a company. Generous payouts from Web 1.0 IPOs and more-recent acquisitions have given rise to a new generation of angel investors and venture capitalists. Plus, getting acquired by Google is an attractive and plausible exit strategy for many entrepreneurs. Those factors have combined to make a startup market almost as frothy as the dot-com bubble.

We say almost, because the spending is a bit less lavish than before, and because -- unlike 1999 -- many of the new crop of startups have real promise. Here are 10 pre-IPO, pre-acquisition companies worth watching in 2008.


There's a lot you could buy with $1,000, but for that price 23andMe offers something never before sold to the masses: your DNA. Are you predisposed to prostate cancer? Glaucoma? Heart disease? 23andMe, profiled recently in Wired, can tell you. The implications could rock the medical world -- and the ethical one. As the science of genomics continues to improve, 23andMe should be able to provide ever-better information. In 2008, it will also provide social networking between customers who share traits ranging from ethnic origins to disease profiles.
  • Founders: Linda Avey and Anne Wojcicki
  • Funding: $12 million, from Genentech, Google and New Enterprise Associates
  • Employees: 30


There's a reason nobody ever uses the phrase, "It's as simple as computer programming." But Chicago's 37Signals has made life simpler for programmers and small businesses alike with products such as Basecamp (project management software) and an increasingly popular open source web framework called Ruby on Rails. The company ditches the philosophy of "more features, more better" in favor of simplicity and accessibility: Focus only on the most important features and make things easier to use. The company itself embodies its keep-it-simple philosophy: Fewer than 10 staffers, working from humble offices, create programs quickly and nimbly adapt them based on user feedback. 37Signals released version 2.0 of Ruby on Rails in December, which should give many programmers a happy new year.
  • Founders: Jason Fried, Ernest Kim, Carlos Segura
  • Funding: Undisclosed sum from Bezos Expeditions
  • Employees: 8


When AdMob launched in 2005, its prospects did not look bright. As a startup mobile-advertising network, it would have to compete with Google, and how feasible is that? But AdMob has defied the odds. While Google is just four months into testing a mobile version of its advertising network, AdMob has already served 12 billion ad impressions to mobile users. As more consumers buy web-enabled mobile phones, the prospects for mobile advertising can only improve.
  • Founder: Omar Hamoui
  • Funding: Undisclosed Series A from Sequoia Capital; $15 million Series B from Accel Partners and Sequoia Capital
  • Employees: 65


As a peer-to-peer, or P2P, download protocol, BitTorrent was perfect for illegal file sharing. But in late 2007, the parent company of that protocol -- also called BitTorrent -- unveiled a potentially disruptive new use for its P2P technology: a platform that software providers and media companies can use to help customers download high-resolution files faster (and legally). By reducing distribution hurdles, BitTorrent will make online video and software sales increasingly viable in 2008 and will challenge the notion that the idiot box is the primary way to get your CSI fix.
  • Founders: Bram Cohen and Ashwin Navin
  • Funding: $28.75 million from Accel Partners and DCM (formerly Doll Capital Management)
  • Employees: 60


Today, GPS is a one-way street, with a satellite beaming instructions to your device. You turn left because a chip inside your GPS device calculated that would the best route. In 2008, Dash

will chart a new course with Dash Express, a GPS that learns from its users. If a Dash owner is moving 5 miles per hour in a 45 mph zone, Dash servers will realize he's in traffic and warn other Dash drivers to choose faster routes. Sure beats calling 5-1-1.

  • Founders: Brian Smartt, Mike Tzamaloukas, Steve Wollenberg
  • Funding: $45 million from Kleiner Perkins Caufield & Byers, Sequoia Capital, Skymoon Ventures, Crescendo Ventures, ZenShin Capital Partners, Artis Capital, Gold Hill Capital, and several individuals
  • Employees: 85


You pay for internet access at home, so why must you pay for it again at the coffee shop, the airport and the hotel? That frustration spawned Spanish Wi-Fi startup Fon. It's a simple idea: Give and you shall receive. "Foneros" first agree to share their home wireless connections with other Fon customers using a special router, which splits the signal into public and private streams. In exchange, they get the privilege of using any of the network's wireless signals anywhere in the world for free. Fon has inked important deals with TimeWarner Cable in the United States, BT in Britain and Neuf in France, and its network has expanded to an impressive 600,000 registered users worldwide. Free global internet for the price you already pay at home? Sign us up!
  • Founder: Martin Varsavsky
  • Funding: Approx. $35 million from Skype, Google, Index Ventures, Sequoia Capital, Excite, Digital Garage and BT
  • Employees: Approximately 90 worldwide


LinkedIn, a career-oriented social networking site, found 16 million users, yet until recently has been eclipsed by much larger, livelier competitors. Now, a much-needed upgrade has the 4-year-old startup looking pretty good after all. A new developer platform aims to bring LinkedIn networks to the web at large, starting with Business Week's website, which will show your connections to any companies mentioned in news articles you're reading. LinkedIn still emphasizes utility over frivolity, and that's just the way we like it. Instead of virtual hugs and stripper name generators, expect the site to add "modules" that gather news and events from your industry. The dull-but-useful strategy seems to be working: LinkedIn projects revenues of nearly $100 million in 2008 -- not too shabby compared to much larger Facebook's estimated $150 million for 2007.
  • Founders: Reid Hoffman, Allen Blue, Konstantin Guericke, Eric Ly, Jean-Luc Valliant
  • Funding: $27.5 million from Sequoia Capital, Greylock, the European Founders Fund, Bessemer Venture Partners, and numerous individual angel investors
  • Employees: 200


It's gotten hard to imagine a world where Google doesn't dominate internet search, but some believe that if anyone can dethrone the king, it's Powerset. The San Francisco company is developing an alternative "natural language" search technology, which takes into account the actual meaning and context of words in a sentence. Of course, it's not the first time someone has tried to make computers think more like human beings, and HAL 9000 is still MIA. And despite an impressive demo at the TechCrunch 40 conference in September, Powerset's management has struggled recently, losing one founder (Steve Newcomb) while another (Barney Pell) stepped down from the CEO position. Even if Powerset's search engine doesn't make it to market in 2008, Silicon Valley will be closely watching to company for any signs of progress -- or lack thereof.
  • Founders: Steve Newcomb, Barney Pell and Lorenzo Thione
  • Funding: $12.5 million from Foundation Capital, The Founder's Fund and several angel investors
  • Employees: 60


In the battle of Facebook vs. the OpenSocial gang, there's one assured winner, and it's not even technically in the fight. Slide, the largest provider of third-party applications (aka "widgets") to websites and social networks, stands to win no matter which network comes out on top. (Slide's chief widget-making rival, RockYou, is also well in the mix.) Slide's success is only pegged to the social networking trend, which shows no signs of flagging in 2008.
  • Founder: Max Levchin
  • Funding: Initial funding from Max Levchin; a rumored $20 million from BlueRun Ventures, The Founder's Fund, Khosla Ventures, Mayfield Fund
  • Employees: 60


Google can search the web by keyword, but Spock gets more directly at a single question: What does the web know about you? By crawling the web for personal information and combining that with social network data, Spock creates a hub for information about actual people. Enter your name in Spock's pared-down interface and find out what the internet knows about you, or search by a keyword to find, say, ornithologists or sommeliers. Spock generates its profiles automatically, but individuals can "claim" theirs and correct any misinformation. In fact, you might want to check yours right now....
  • Founders: Jaideep Singh and Jay Bhatti
  • Funding: $8 million from Clearstone Venture Partners and Opus Capital
  • Employees: 25
StumbleUpon Toolbar

A Beginner’s Guide To Freelance Business Processes


Process schmocess. Who needs them eh? Well actually every business needs them, no matter how big or small you are; but if you’re a one-man freelancing business you might still be wondering why you need to bother with them?

Having effective processes in place can help you…

  • Spend less time on the boring, time-consuming aspects of your business
  • Build a client-generating machine
  • Let go of some of the reins and work out what tasks you can hand over to someone else (also known as outsourcing)
  • Set your business up to grow beyond the confines and limitations of a small, one-man band business without the additional hassle and growing pains

If you’re just starting out or you have no idea how to implement smarter processes in your business, then here’s a brief guide to implement some of the basics…

Basic Marketing Processes

Many freelancers hate marketing themselves and would far rather work in their business servicing clients than spend time generating new clients. If this sounds like you, then implementing some or all of the following, could make completing your marketing chores simpler and less arduous:

  • Plan out your prospect journey - plan out a sequence of all the steps that an ideal prospect could take on their journey with you before they become a client. This will include how and where you’d like them to find out about you initially; where they can go to get more information; the choices they have; and what they need to do to become a client.
  • Create ‘common enquiry’ email templates to respond to some of the more common requests you receive such as requests for more information about what you offer, requests for your prices, more details about how you work, your payment terms and how to respond to media enquiries.
  • Prepare some standard marketing materials such as client reference sheets or info packs for each of your individual services and products. These could include a price list and some testimonials and could be sent over as attachments to the above emails or snail-mailed to interested prospects.
  • Create a “marketing message bank” of the key marketing messages that you’ve defined for each of your target markets; whenever you need to create some marketing materials, you can then pick and choose or cut and paste from the headlines, bullet points and calls to action that you’ve got in your marketing message bank.

Operations & Service Delivery Processes

As you work in your business, begin to compile a basic manual for some of the typical things you do to run your business and service your clients effectively. A great way to start doing this is to make a note every time you’re doing something that you think someone else could do for you. These may include:

  • Bringing on a new client - tasks included in this process might be how you collect payment details; when you send out a welcome pack; how & where you enter client details into your CRM system or customer management spreadsheet.
  • Managing client billing - tasks in this process might include how & where you enter details into your invoicing system; how and when you send out your invoices; how you deal with and chase up missing payments.
  • Making a business purchase - tasks for this process might include how you raise a purchase order; how you purchase items with a company credit card; how and where to log the purchase in your business inventory; how and where to file the receipt.
  • Finishing work with a client - these tasks might include sending a “thank you” email; asking for feedback or a testimonial; how you plan to keep in touch with them and send details of further support available.
  • Prepare a range of basic “Company Info” sheets which detail the key information you’re likely to need for “official” purposes; this includes your official business/trading name, your company structure, date of incorporation if relevant, trademark and copyright info and the names and contact details of professionals like your bank, accountant, insurance advisor, lawyer.

Maximising People Productivity

The following suggestions can help improve not only your own personal productivity but also help prepare your business for introducing new people. Whether as employees, sub-contractors or outsourcers, improving and enabling their effectiveness to do their job means they won’t have to drain your time by asking you how to do something every 10 minutes…

  • Create a bookmarks folder of frequently accessed services in your browser - mine is called “Daily Admin”; if you work in a team, then use an online bookmarking service to share frequently used bookmarks.
  • Keep a folder of frequently used programs and software on your desktop or in the “quick start” menu of your computer and then create a USB key or zipped folder of these programs (with applicable licences of course) which you can share with any new team members who join you.
  • Create a folder of frequently used documents/templates on your desktop and/or share them using google docs or another file sharing service which lets your team access the resources they need.
  • Knowledge management for small businesses means gathering together in one easily accessible place, any useful tools and resources that will improve your and your team’s ability to do their jobs. This could include marketing resources, “how to” resources or any guides that you refer to regularly.
  • Create job spec sheets for all the roles required to run your business - yes, even if you currently fulfill all of them yourself! Doing this will not only help you improve your effectiveness in each role, it will help you define what you’re looking for when the time is right to expand; and will help ensure that the person you hire knows exactly what is expected of them in their role.

If all of this sounds a bit daunting and you have no idea where to start, then the key to creating and refining effective business processes is to start to log the key activities you do on a day-to-day basis. You’ll begin to notice the tasks that take up too much of your time, the tasks you hate doing and you wish someone else would do, and the tasks that you do on a regular basis but have always suspected there is a more efficient way of doing them.

When you have this list then start with these processes, take a step back and think about how you’d do them if you were starting all over again…then document them.

When the time comes to expand or outsource parts of your business, having the above basics in place will help you do this far more smoothly and effectively.

StumbleUpon Toolbar

Thursday, December 27, 2007

Paper Prototyping

Source: A List Apart

As interfaces become ever more complex and development schedules seem to get shorter and shorter, you may find it useful to give up your user-interface modeling software for awhile in favor of something simpler. All you need is paper, pens, scissors, and your imagination.

Everyone loves paper
Just as a political party aims to be a “big tent,” product development teams should seek input from as many people as possible during the early part of a project’s design phase. Though HTML prototypes can be useful, they can also discourage those who are unsure what the medium is capable of. Paper prototypes, on the other hand, invite people with little-to-no technical background into the design process.

I cannot emphasize enough how important the inclusive quality of paper can be. Though some people shy away from paper prototypes because they feel they will not be taken seriously, I argue that many people are intimidated by a formal, highly technical design process and that the less “professional” nature of paper prototyping is a great way to lighten the mood and engage a more diverse group. Just offer plenty of paper, pens, scissors, and other materials for anyone to grab and use. If anyone feels nervous, let them eat the paste.

Easy iterations
Paper prototyping can also help improve the final product: the prototyping stage is the right time to catch design flaws and change directions, and the flexibility and disposability of paper encourages experimentation and speedy iteration. Instead of “deleting” hours worth of layout code you’ve used to position a column in the right place, you can draw a prototype, throw away the ideas that don’t work, and move on.

Built for your budget
If you are on a shoestring budget, paper is a great low-cost alternative to many software packages—and if you have a larger budget, you can use products like Post-it notes or tabbed index card dividers to make your paper prototypes more sophisticated. If it helps your team, you can print full-color objects to use in your prototyping sessions. You might want a low-quality printer in the meeting room connected to someone’s laptop for printing out new ideas. If someone recommends a website they’ve seen online, just print out a screenshot, tack it to the wall, and start doodling on it.

On the flip side, you can also use paper prototypes to run a technology-free design meeting: turn off your laptops, stop checking your e-mail, and focus on the task at hand.

Easy documentation
Another benefit of using paper is that you can write notes right on the prototype or on the back of each sheet or index card. While an advanced group might feel comfortable using a wiki for information capture, other teams may find these attached notes a godsend weeks later when they actually start writing code for that pesky dialog box.

Show me the paper
raditional user interface widgets can be modeled easily with paper. Here is a set “tabs” showing a couple of buttons and what happens when you “click” on a drop-down menu:
Photo of mockup drawn on paper
Photo of mockup drawn on paper
You can always save a buck or two by using regular index cards and cutting out the tab labels yourself.

Dynamic boxes, common in websites with contextual or personalized information, are possible too. To “refresh” the page, simply swap out the index cards. Here a username not found in the database triggers an error and on a successful login the box displays the “my account”widget:

Photo of mockup drawn on paper

Photo of mockup drawn on paper

Photo of mockup drawn on paper
It is possible to demonstrate problems such as a pop-up windows that block key elements of your interface and potential alternatives to the pop-up:
Paper prototype sample of a pop-up window over a body of text.
For every link and button on your mock-ups, be prepared to have a matching sketch ready to display—or have someone take suggestions from your group and sketch a new dialog, page, or window in real time.

Besides the materials mentioned, I recommend a removable glue stick that can be found cheap at an office supply store. Glue sticks are the “magic” that lets you easily put together and take apart a paper interface.

Where does paper prototyping fit into the design process?
There are two dominant uses:
  1. The design team uses paper for their presentation to a larger group of people who have a vested interest in the product.
  2. Users run through a set of existing paper mock-ups or are given blank paper and asked to represent a concept by sketching it.
Option two is a great way to “unplug” and go directly to people willing to test your interface. As an example, let’s look at the ways in which paper can fit into the usability testing process.

Usability testing with paper prototypes
A paper usability-testing session works much like any other usability-testing session. Begin by selecting a range of testers who represent your expected audience. Have scenarios ready for the user to perform. Document the testing sessions with video to review the users’ emotional state when using your mocked-up interface. Debrief users afterward to measure interface recall. With paper, you can also:
  • Allow users to mock up ideas they think would solve a problem.
  • Mark on the prototype where a user attempted to “click” or otherwise interact with the interface.
  • Ask users to draw what they expect to happen next.
  • Keep going even if you don’t have access to a testing lab or if computers, networks, or high-tech prototypes don’t work as expected.

While it’s valuable to measure the success of your interface via time-based benchmarks, the emphasis should be on getting your focus group to be creative. If you’d like to read about a real-world experience check out Carolyn Snyder’s article on a six-day session using paper prototypes with clients and end-users.

When paper isn’t ideal
A major benefit of paper is the user-generated content that comes out of the feedback sessions. Chances are, a one-person shop will have a hard time reaping the benefits of paper without the collaborative process that occurs in “using” the prototype with others.

There are also certain concepts that remain difficult to demonstrate with paper: how long a screen takes to load or refresh, for instance. Horizontal and vertical scrolling is a common website interface problem that is almost impossible to discover with a paper prototype. Specific colors, images, and fonts aren’t easily represented on the simplest paper prototypes. Still, I have used computer print-outs in combination with paper to tackle at least some of these issues.

Earlier in this article, you saw an example with Arabic text that uses material I printed out. Because Arabic text is written right to left, I wanted to keep this in mind when positioning the main body of text on the interface. The Arabic font also requires the text be large enough to read diacritical marks. Be sure to include people in your paper sessions who can explain how advanced interface widgets, graphics, fonts, and embedded multimedia elements might affect the design.

Where do we go from here?
If you want to dig deeper, Carolyn Snyder’s Paper Prototyping is the most recognized work on this subject and is highly recommended.

Paper has seen a resurgence with knowledge workers who aim to organize every aspect of their lives. The Hipster PDA breathed life into its community and spawned projects such as the DIY Planner, which is based on a set of printable templates for calendars, to-do lists, and more.

Note: The paper prototyping field might benefit from an open-source library of similar printable widgets, which could be modeled using SVG or provided in a standard format such as PDF. Online resources such as the GUIdebook and wireframing templates for Visio and OmniGraffle may provide a good start point for generating ideas. If anyone is interested in creating an open-source printable widget library, I will provide free hosting space for project tools such as a wiki and SVN repository for checking out the latest and greatest templates.

Finally, there are some efforts to merge paper concepts with technology using tablet computing. Professor James Landay at the University of Washington has been working on a tool called DENIM since the mid-90s that is aimed at creating websites. DENIM allows you to sketch your ideas, annotate them, and even export a working HTML site suitable for use in demonstrations.
StumbleUpon Toolbar

Wednesday, December 26, 2007

12 Invaluable Sites for Web Design and Design Inspiration



Whether you are a professional or amateur web designer, or simply want to learn more about how web design works, these are great resources to browse and bookmark. This collection covers various design styles, guides and tools as well as free fonts, stock photographs and vector images. These have been organized into three complimentary categories: inspiration, guides and resources. Enjoy!

Web Design Inspiration:

CSS Zen Garden A demonstration of what can be accomplished visually through CSS-based design. Select any style sheet from the list to load it into this page. The Zen Garden aims to excite, inspire, and encourage participation. To begin, view some of the existing designs in the list. Clicking on any one will load the style sheet into this very page. The code remains the same, the only thing that has changed is the external .css file. Yes, really.

Web Design Inspiration is a Flickr image set collecting a variety of successful web designs of all different kinds, over 400 total. It has a great collection of eye-candy for the non-designer as well as inspirational works of creativity to motivate any designer, web or otherwise.

Web Creme provides frequently updated screenshots in an elegant-but-simple blog-like format for web designers to browse. This enables designers to easily check back in should they be searching for some easy design inspiration and regularly refreshed content.

Unmatched Style is a constantly growing community dedicated to acknowledging those who have made exceptionally gorgeous web sites using Cascading Style Sheets and web standards. By recognizing these exceptionally beautiful designs, other designers and businesses can get inspired and find a direction they may wish to take with their own web sites.

CSS Beauty is a project focused on providing its audience with a database of well designed CSS based websites from around the world. Its purpose is to showcase designers’ work and to act as a small portal to the CSS design community. If you are “in need of inspiration”, you have come to the right place.

WebUrbanist is a collectively produced urban art, culture and design weblog that has a simple layout and a profound series of posts with series of Seven Wonders of the World as well as other sources of design inspiration from around the world, including urban art images that provide indirect inspiration for web and other designers.

Web Design Guides:

Web Design from Scratch is for everyone involved or interested in creating web sites - whether novice or expert. It will help you understand what makes web sites succeed or fail, and what can be done to increase the chance of success. You don’t have to be a web designer to benefit from this site. You may have a current web site design project, you may be updating an existing site, or just interested in learning new skills. Also be sure to check out his Current Style in Web Design Guide.

Web 2.0 How-To Design Style Guide: In this tutorial, the author describes various common graphic design elements in modern web (”2.0″) design style. He then explains why they work (i.e. why they have become common), as well as how, when and where you might use each element in your designs.

Top 50 Logo Design Tutorials has an excellent selection of logo design guides with helpful screenshots that will assist you in navigating the various links. Whether you are looking for something detailed and creative or simple and elegant there is almost certainly something useful on this list.

51 Photoshop Text Effect Tutorials. ext and the way it looks is a major part of any design. A great design can be cheapened if the text on the page looks wrong. Any logo is almost entirely text. From water to fire, these 51 tutorials will show you how to create any style of text you want.

Web Design Resources:

Open Source Web Design is a site to download free web design templates and share yours with others. They help make the internet a prettier place. To put it simply, Open Source Web Design is a collection of web designs submitted by the community that anyone can download free of charge!

Blue Vertigo showcases an amazing array of free resources for web designers, from stockphotography and vector clip art to free fonts and brushes. This is truly a site worth bookmarking for future use.

Browser Shots allows you to test out your designs in various browsers quickly and easily. Browsershots makes screenshots of your web design in different browsers. It is a free open-source online service created by Johann C. Rocholl. When you submit your web address, it will be added to the job queue. A number of distributed computers will open your website in their browser. Then they will make screenshots and upload them to the central server here.

StumbleUpon Toolbar
© 2007 Designrific.