<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Ecommerce Journal &#187; Design</title>
	<atom:link href="http://www.lc7inc.com/tag/design/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.lc7inc.com</link>
	<description>Technical Articles and Insight for Small Businesses</description>
	<lastBuildDate>Tue, 24 Jan 2012 15:22:04 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.9.1</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>TechXpress.net New Site Launch</title>
		<link>http://www.lc7inc.com/featured/techxpress-net-new-site-launch/</link>
		<comments>http://www.lc7inc.com/featured/techxpress-net-new-site-launch/#comments</comments>
		<pubDate>Tue, 23 Mar 2010 04:33:43 +0000</pubDate>
		<dc:creator>Louis Camassa</dc:creator>
				<category><![CDATA[Featured]]></category>
		<category><![CDATA[Website Launches]]></category>
		<category><![CDATA[Design]]></category>
		<category><![CDATA[lead generation site]]></category>
		<category><![CDATA[new website launch]]></category>
		<category><![CDATA[techxpress.net]]></category>

		<guid isPermaLink="false">http://www.lc7inc.com/?p=241</guid>
		<description><![CDATA[After many years of on-and-off development/design, we finally completed the TechXpress.net website! Constant client projects made it challenging to focus on our own website, however, 8 years of a stagnant and outdated website was enough! Below are a couple of screenshots from the new site, check it out at http://www.techxpress.net 
  
 
 

]]></description>
			<content:encoded><![CDATA[<p style="text-align: left;"><a href="http://www.lc7inc.com/wp-content/uploads/2010/03/tx-insidepage-3-2010.png"></a>After many years of on-and-off development/design, we finally completed the TechXpress.net website! Constant client projects made it challenging to focus on our own website, however, 8 years of a stagnant and outdated website was enough! Below are a couple of screenshots from the new site, check it out at <a href="http://www.techxpress.net" target="_blank">http://www.techxpress.net</a> </p>
<p style="text-align: center;">  </p>
<p style="text-align: center;"><a href="http://www.lc7inc.com/wp-content/uploads/2010/03/tx-homepage-3-2010.png" target="_blank"><img class="size-large wp-image-242    aligncenter" style="border: 0px;" title="tx-homepage-3-2010" src="http://www.lc7inc.com/wp-content/uploads/2010/03/tx-homepage-3-2010-360x420.png" alt="" width="360" height="420" /></a> </p>
<hr /> </p>
<p style="text-align: center;"><a href="http://www.lc7inc.com/wp-content/uploads/2010/03/tx-insidepage-3-2010.png" target="_blank"><img class="aligncenter" style="border: 0px;" title="tx-insidepage-3-2010" src="http://www.lc7inc.com/wp-content/uploads/2010/03/tx-insidepage-3-2010-360x420.png" alt="" width="360" height="420" /></a></p>
]]></content:encoded>
			<wfw:commentRss>http://www.lc7inc.com/featured/techxpress-net-new-site-launch/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Managing the Design Phase</title>
		<link>http://www.lc7inc.com/design/managing-the-design-phase/</link>
		<comments>http://www.lc7inc.com/design/managing-the-design-phase/#comments</comments>
		<pubDate>Fri, 18 Dec 2009 04:41:30 +0000</pubDate>
		<dc:creator>Louis Camassa</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[Featured]]></category>
		<category><![CDATA[design challenges]]></category>
		<category><![CDATA[phase process]]></category>

		<guid isPermaLink="false">http://www.lc7inc.com/?p=59</guid>
		<description><![CDATA[A highly subjective, yet extremely important component of a website-the Design Phase-encompasses the layout, font, hierarchy, color and image use of a website. Add in operating systems, browsers, download speeds and monitor resolutions, and you can quickly become engrossed in a never ending design process. If the technical challenges weren’t enough, you also have a [...]]]></description>
			<content:encoded><![CDATA[<p><a href="http://www.lc7inc.com/wp-content/uploads/2009/12/Managing-the-Web-Project.jpg"></a>A highly subjective, yet extremely important component of a website-the Design Phase-encompasses the layout, font, hierarchy, color and image use of a website. Add in operating systems, browsers, download speeds and monitor resolutions, and you can quickly become engrossed in a never ending design process. If the technical challenges weren’t enough, you also have a client or clients to please. This article will present a few key methods for managing the expectations of your client(s) while designing a user friendly, conversion centric, and cross compatible website.   </p>
<p>Directed more towards project managers, designers and webmasters, this article will provide some tidbits of knowledge to help you get through the design phase without having to Frankenstein your design!</p>
<p>After implementing some of these tactics you should see an increase in the design phase process, profitability, client satisfaction, and overall design quality.</p>
<p><strong>Proposal Terms and Agreement</strong>- make sure you define, up front, the design limits/constraints</p>
<p style="padding-left: 30px;"><strong>Limits</strong><br />
Depending upon how you charge for services, either set up a limit on how many design revisions are allowed or how many hours can be utilized. Make sure to define these limits per page (home, content, product, category, etc…) or globally for all pages. Define a price for overages on revisions or hours, so the client is clear on the boundaries. This will help you to avoid endless changes and never-ending  hours of time.  I also recommend including a floating block of time that can be used above and beyond the limits specified for unanticipated changes.</p>
<p style="padding-left: 30px;"><strong>What’s Included<br />
</strong>Define what is included in the design of the site. For example, will stock photography be used in the design, if so, what are the charges? How many pages will be designed? What if the website has hundreds of content pages, with thousands of images-define a set number of pages that will be custom designed, and use a standard template for the rest.  Although, in many cases, even templates still need tweaks. Some items to think about, and to include in your proposal:</p>
<ul>
<li> 
<ul>
<li>
<div style="padding-left: 30px;">Home, category, product, system and content pages</div>
</li>
<li>
<div style="padding-left: 30px;">Favorite icon</div>
</li>
<li>
<div style="padding-left: 30px;">Internal banner ads (for promotions, categories, content pages etc…)</div>
</li>
<li>
<div style="padding-left: 30px;">External banner ads (for advertising on other websites)</div>
</li>
<li>
<div style="padding-left: 30px;">Email marketing newsletter template</div>
</li>
<li>
<div style="padding-left: 30px;">Email receipts and campaigns</div>
</li>
<li>
<div style="padding-left: 30px;">Packing slip, and shipping labels</div>
</li>
<li>
<div style="padding-left: 30px;">Stock photography</div>
</li>
<li>
<div style="padding-left: 30px;">Error pages, e.g. 404</div>
</li>
</ul>
</li>
</ul>
<p style="padding-left: 30px;"><strong>What’s Expected<br />
</strong>Ok, you defined what you are going to deliver on, now what is the client responsible for? That is, they need to give you some background, direction, content and images, to help you design the site right. Clearly articulate what the client is responsible for delivering, in what format, and by what date. Listed below are examples of these deliverables:</p>
<ul>
<li> 
<ul>
<li>
<div style="padding-left: 30px;">Content outline due within x months of request, via Word or Excel</div>
</li>
<li>
<div style="padding-left: 30px;">Product and category outline due within x months of request, via Excel</div>
</li>
<li>
<div style="padding-left: 30px;">Video files due within x months of request, provided via Youtube link</div>
</li>
<li>
<div style="padding-left: 30px;">Imagery and design materials due within x months of request</div>
</li>
<li>
<div style="padding-left: 30px;">Product images must be in JPG format, at least 500 x 500 pixels</div>
</li>
<li>
<div style="padding-left: 30px;">Lifestyle images must be in JPG format, at least 300 x 300 pixels</div>
</li>
<li>
<div style="padding-left: 30px;">Design changes due within x days of phase review</div>
</li>
</ul>
</li>
</ul>
<p><strong>Client Engagement and Expectations</strong> – build trust once the project has been sold, and set the pace of the project.</p>
<p style="padding-left: 30px;"><strong>Experience</strong><br />
Since the client signed off on the project, they probably already trust your design skills. Although I always reinforce the background we have in design; how many sites we’ve designed over the years, awards won, before and after examples, etc..</p>
<p style="padding-left: 30px;"><strong>Outline the Design Process</strong><br />
Make it clear how the design process flows. For example, if you wireframe the homepage first, and then review it with the client, let them know this. Explain how they will be involved, how long each phase takes, and the reason for performing the phase. This will provide greater understanding to the client, which should lead to more trust. I usually provide a step-by-step overview of the entire design process-from start to finish-so everyone is on the same page.</p>
<p><strong>Execution </strong>– how to structure the design phase.</p>
<p style="padding-left: 30px;"><strong>Content First<br />
</strong>Before you even think about the design, make sure you have all the content, products, categories, and marketing items. Without understanding what the client is selling, and how he is selling it, your design will require massive changes.</p>
<p style="padding-left: 30px;">E.g., if they only have 3 products available to start, but are considering adding hundreds more in the future, you have to design the navigation system differently so a customer can quickly access different product categories. The same is true for content-although many clients have lofty expectations for what they want included on their websites, writing content takes time. More content, also requires more design and programming time, so make sure you have a clear content outline before you start designing.</p>
<p style="padding-left: 30px;"><strong>Wireframe<br />
</strong>After you have received all the top level content, and product information, design a homepage wireframe to review with the client. Wireframes set the initial direction for the actual design and take a fraction of the time. They also allow the client to visualize the site, and make suggestions or ask questions. It is much faster and economical to make changes to a wireframe than it is an actual design. I design a wireframe for all the major template pages and review each with the client. This has reduced design changes on the actual designs substantially. Many projects are signed off on the first or second concept.</p>
<p style="padding-left: 30px;">Another great benefit of the wireframe is to provide the frame of reference of the site to the designer. This allows the designer to focus on the design rather than what needs to be included (content, marketing features, images etc…).</p>
<p style="padding-left: 30px;"><strong>Design Presentation</strong><br />
When your designer sends you the final design, compare it to the wireframe to ensure it has all the specified items. I also request design notes on what the designer was thinking in terms of; hierarchy, colors, fonts, image use and layout.</p>
<p style="padding-left: 30px;">Meet with the client; don’t just send them the design. It is important to explain the design to them so they understand the meaning behind it.</p>
<p style="padding-left: 30px;">I always show the existing site design first, as a before and after type of effect. This is usually a very powerful tool-especially if the old design is outdated!</p>
<p style="padding-left: 30px;">I also print out a copy of the design so the client can have a take away, and scribble notes on it.</p>
<p style="padding-left: 30px;">When first showing the design, I pause and allow the client to take it all in, I then explain the concepts behind the design from top to bottom, including the designer notes. At this point the client will ask some questions, request some changes, need time to resonate with it.</p>
<p style="padding-left: 30px;">After the meeting, I send a follow up email with the design attached asking them to get back to me in x days with their thoughts. Usually a few minor design requests are made, in which case, I add them to a change request form, and send it to the client to approve.<br />
<strong><br />
Design Signoff</strong><br />
The change request form is critical in defining the work requested, as well as making the process official. If you make changes on the fly, it devalues your service and encourages clients to make one more quick change. Directing them to put it on the change request list will force them to think the changes through.</p>
<p style="padding-left: 30px;">Once the client is happy with the design, send an approval form that explains this is the final version, any additional changes will require addition expense, etc…Be clear that this is it-no more changes!</p>
<p><strong>Additional Tips – </strong>you will always encounter some clients who you don’t quite see eye-to-eye with, and come to an impasse. Use the tips below to push the pace!</p>
<p style="padding-left: 30px;"> The design comparison – for those clients who want to see more than one composition so they can see a comparison. I usually explain that when we create the wireframe, we have thought out all the specific details, so there will be few changes from the wireframe to the design.</p>
<p style="padding-left: 30px;">Never ending changes – if the client continues to request changes, and blows through the limits set, make one more final list for the client to make a request. In this final list, make it clear that additional changes will be billed.</p>
<p style="padding-left: 30px;">Release of responsibility – sometimes clients want to design the site using their own colors, layout ideas, and other crazy design concoctions. Simply require them to sign a release of liability that explains how you will have no liability should the site get negative reviews, low sales, etc…Usually when presented with this approach, clients second think the animated gif featuring the spinning globe of the world.</p>
<p style="padding-left: 30px;">Cross compatibility – is the color a little off, or the type a sliver to small? Explain to the client that the website will look a little different for each user due to different browsers, operating systems, monitors, graphic cards, etc…</p>
<p style="padding-left: 30px;">Uncertainty – for that client that neither likes it or dislikes it, explain the design using industry best practices, statistics, and facts/figures on why the design was made the way it was. I usually break out the heat maps, analytic overlays, and recorded browser sessions to help convey my message.</p>
<p style="padding-left: 30px;">General Dislike – for those clients who ask the opinions of all their friends and family (even little children). Enroll the help of your fellow web users; browse to the many web forums out there and get feedback on the design. Better yet, hold a Usability Test-you can find some low cost services at fivesecondtest.com, feedbackarmy.com, loop11.com, etc…Take the responses you get and provide to the client-this should provide the motivation they need to sign off!</p>
<p>Ultimately, the client hired you for a reason, but they still deserve respect and need to be listened to, as they know their business better than you!</p>
]]></content:encoded>
			<wfw:commentRss>http://www.lc7inc.com/design/managing-the-design-phase/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

