Grow

Vol.
A beginners guide to growing

your design or development business
The lives we lead are

increasingly carried out
online.
Its where people go to shop, to find work, to communicate

with their network and to hire people to help them look
good on the internet.
Thats where you come in. The market is rich with entrepreneurs,
merchants, businesses small and large looking for assistance creating
their online store. They might be tech-savvy, but they often have
complicated customization requirements or simply not enough time to
worry about it.
Your choice to become a web-based freelancer or small business is a
great one. But now that youve made that decision...whats next?
How do you brand yourself online to stand apart from the masses?
How do you find your first customer? When you do find a prospect,
how do you draft a killer proposal that will win them over? How do
you decide what to charge? What the heck does a standard client
contract look like? What about an invoice? What are the necessary
steps you need to take before launching a store for a client?
These, among others, are the questions we will answer in this guide.
Weve reached out to some of the industrys finest, who have been
working with clients and navigating this online market for years. Ten
different authors share 10 chapters full of insights and practical advice
that you can take to build your business into something sustainable.
We include templates, checklists and recommendations for everything
youll need to start your business.
Ready? Lets get growing.
Contents
1 / Branding by Alex Hunter

2 / Marketing by Alex OByrne
3 / The Proposal by Ross Beyeler
4 / Value-Based Pricing by Ben Crudo
5 / The Contract by Ryan Foster
6 / Customer Service by Paul Boag
7 / Mobile by Galen King
8 / Invoicing and Payment by Kurt Elster
9 / Your Business Toolkit by Ben MacGowan
10 / Launch Checklist by Mat Mullen
11 / Shopifys Partner Program
1 / Branding
Deciding what your

company stands for
by Alex Hunter
Alex Hunter is a company

incubator, keynote speaker, angel
investor, and branding expert.
Alex most recently served as the
Chief Executive of a venturebacked digital music company,
steering it from pre-alpha to
Series A financing, a successful
international M&A deal, and
multi-national growth.
Brand. Its one of those funny words that gets tossed around
a lot without much care or discretion.
To really dive into what brand is, we need to spend some time talking
about what brand isnt. How many times have you heard something
like this: I really like their new brand or the packaging has the new
branding on it? Often, Im sure. For a long time now weve laboured
under the delusion that brand equals logo. Wrong. Or that brand
equals corporate identity. Wrong again, Charlie. They are mere outputs
of a much, much bigger concept that we need to get comfortable with
before we move on to how you can cultivate and care for your own
brand.
So lets start by dismissing the idea that brand has anything to do with
the visual identity of an organization. Thats putting the cart so far
before the horse that the horse is looking at you like, What...what am
I supposed to be doing here...idiot. And theres no need to take abuse
from a horse.
1 / Branding
Now that weve cleared up that little misconception about what brand
means, lets talk about what brand actually is. More importantly, lets
talk about what YOUR brand is.
If youre reading this collection of articles, its clear that youre
committed to whatever it is youre working on. Thats a great start. You
may already have things in motion and are looking to take things to
the next level. No matter where you are on the journey, I want you to
ask yourself some important questions: Why are you doing what youre
doing? Why are you building this business? Why do you get up every
morning, switch on the computer and create?
Now wait! Hear that? That answer, the one you just gave, THAT is
your brand. That is your raison detre. That is your mission. That is
your goal. And it should be reflected in every little thing that you
do, everything you produce, every conversation you have with your
customers or clients, online or offline. And we can neatly package all
of that into one word. Brand. Brand is the manifestation of your reason
for being. It must permeate every facet of what you do and be made
real in everything you create, from your core product to an off-the-cuff
note you write to a valued customer.
Comfortable with that? Good. But everyone that works with or for you
has to be totally comfortable with why you do what you do, too. Brand
is not built in the board room; its built on the shop floor so include
your team (if you have one) in any activities that involve your brand,
its definition, its application, and its evolution.
1 / Branding
Once you and your crew are comfortable with this concept, its time to
distill it into some practical applications.
Its important (and fun) to find creative and engaging ways to
communicate your brand to the wider world. Its all fine and dandy to
have a clear brand and a great product, but it doesnt mean diddly if no
one knows about it. So give your customers even if theres just one
of them and its a friend or your mom an opportunity and a reason
to talk about you.
Create moments of delight. Create moments of personality. Create
moments where they forget that youre a service provider and they
connect meaningfully with you as a person, even if its just for an
instant. How? Follow up an order with a handwritten note just saying
thanks for being a customer and inviting them to get in touch with
any feedback or questions. Acknowledge that its not a business-toconsumer transaction, but a human-to-human transaction. And use
what you already know about your customer to create that delight.
If a previous customer gets in touch, dont act like its the first time
youve ever met them; we wouldnt do it to someone in the real world,
so dont do it in the business world. Even a Hi Mr. Jones, great to
hear from you, oh hey how is that sprocket working out for you? is
such a powerful tactic. By referencing a past interaction, weve moved
beyond the realms of simple transaction were now cultivating a
relationship. And that is where we build long-term loyalty. Invest
sensibly in that relationship, and you have a customer for life.
1 / Branding
So what about brand positioning? Branding can often try way too hard
to make us appear to be something were not; bigger, smaller, more
international, more local, etc. We think about it when we name our
business (Jack Smiths Agency vs. Smith Global Partners Inc.) or even
how we refer to ourselves (e.g. I vs. We). But Ill let you in on a little
secretIt doesnt have to be that hard.
If you clearly and honestly communicate who you are, you dont have
to spend the time and energy living a lie (and inevitably being caught).
There will always be clients and customers that actively look for small,
boutique businesses and shy away from HyperGlobalMegaCorp. As
you grow, youll start to attract the type of customer who looks for a
company with a bit more heritage and history. And thats exactly what
youll be when they come calling. But if youre trying too hard to be
something youre not, youll alienate the people who actually want to
work with who you really are. Besides, we all know boutique is where
its at in 2015, right?
Now I know we dont know each other that well (yet), but I want you to
promise me something. I want you to promise me that youll give your
brand the time and attention it deserves. When youre a small business,
theres a lot to keep your eye on just to keep your head above water.
And because of that, brand tends to be neglected in smaller businesses.
But in return for your promise, I will make YOU a promise: I promise
that if you invest emotionally, financially, and cognitively in your
brand now, it will pay substantial dividends in the future. And now
that youve got your eye on your brand, dont lose sight of it for even
one second. Not today, not tomorrow, and not in 10 years when Im
1 / Branding
looking at you on the cover of a magazine. (Will we have magazines in

10 years? Who knows, but if we do, I expect to see you on their covers.)
Work hard. Stay positive. Build something. And to add some fuel
to your creative fire, I want to leave you with a bushel of delicious
branding nuggets that have tickled me over the last year or so.
Pact Coffee, a subscription coffee company in the UK, tracked me
down after an exchange on Twitter and sent me a box of coffee and
a handwritten note referencing our online conversation. I am now
totally in love with them.
An online music community regularly sent out handwritten notes
and stickers to some of its more active users and watched their
already impressive engagement metrics skyrocket.
An airline uses technology to enable their inflight service teams
to identify frequent fliers and address them by first name. Sounds
simple, but the use of a first name without looking at a piece of
paper is a powerful gesture.
A boutique hotel in NYC fills your room with your favourite snacks
and drinks so you dont feel so far away from home. Even better,
they remember your selections so when you come back, even
years later, the fridge is already stocked. They are investing in the
relationship, not the transaction. Theyre the hotel Ill always stay in
when I travel to the Big Apple.
1 / Branding
2 / Marketing
Ways to find your

first customer
by Alex OByrne
Alex is a founder at
WeMakeWebsites, one of the top
ranked Shopify Experts in the UK.
He speaks regularly on the topic
of marketing and ecommerce.
WeMakeWebsites builds beautiful
and effective online stores for
creative retail companies and
produces weekly advice for their
mailing list of 8,000 retailers.
Anyone that has push-started a car will know that the

hardest part is the first bit of movement. Inertia as a new
freelancer or agency is the same the hardest clients to get
are usually the first ones. Everything gets easier after that.
Here is a short guide on how to overcome this, based on how we got
started and what we learned over the past 5 years.
What I dont recommend

Walking the streets
When we first got started, I literally walked around London, going into
shops asking if people needed a new website. Sounds stupid, doesnt it?
It was! I only tried it a few of times, but it never worked. Perhaps I was
doing something wrong, but I would not recommend this approach!
Cold calling
Cold calling is not only the most painful approach to take, it is also the
most annoying to be on the receiving end of. Its also not very effective
2 / Marketing
for selling websites unless you have a lot of time to dedicate to it. We
did get one good client out of cold calling, but this was out of many
painful afternoons sitting, phone in hand, staring out the window.
Networking events
I have spent many hours doing this and whilst it can work, it never
seemed to offer a return on time invested. I had some good lunches
and met some pleasant people, but in the end I felt I could better spend
my time elsewhere.
With that said, we have some good agency relationships that came
out of random emails and calls, with subsequent coffee meetings
that ultimately led to us sharing business. I wouldnt rely or focus
on this too much though, as it takes a lot of time and the payoff is
unpredictable.
Relying on word of mouth
Word of mouth is great and something to be proud of; this is how most
good agencies grow. However, we were frustrated with the passive
nature of this approach, and felt we could speed it up. This wasnt the
case though even offering incentives for referrals didnt work. Thats
why we turned to content marketing.
Building a predictable funnel

The approaches above rely on the customer being ready to buy at
the point of interruption, but buying a new website is an expensive
purchase and takes a great deal of consideration. Choosing a platform
2 / Marketing
is a big decision and for an established business, changing workflow

and migrating content could require a great deal of effort.
What I recommend is nurturing your leads by educating them,
establishing yourself as a trusted expert, and then being ready for them
when they are ready to buy. Here is one way to do it.
1. Attract interest
The first step is to start building interest in your services. It goes
without saying that you should have your own website to use as a
platform for your brand. A portfolio is essential for an agency so
consider doing a couple of free jobs for friends or family so that you
can show examples of your work. They dont have to be the most
elaborate projects, just show some of what you are capable of. This is
infinitely better than nothing.
How do you get people to your site though? Here are some good
channels to begin attracting good quality leads.
SHOPIFY EXPERTS
The best converting channel for us is the Shopify Experts Marketplace.
We earned our spot here by bringing a few high quality clients to the
platform. Leads arriving through Shopify Experts have already chosen
Shopify as a platform and are just looking for the right person to do
the work. They are at the buying stage and are set on Shopify so its
straight to making a sale.
Again, having an Experts profile with at least four examples of your
2 / Marketing
work will help. Make sure you have a persuasive introduction to your
company and include testimonials as soon as possible.
BLOGGING
Create blog posts that answer questions businesses may have during
the research stage of an ecommerce project. For example:
Questions related to various ecommerce platforms
Advice on how to write an ecommerce business plan
An overview of good homepage design
An example privacy policy
Dont write posts for other freelancers on your company blog; try to
make all your blog content appealing to potential retail clients.
Ensure your website has good SEO and share your best content on
social media. Google will reward popular content with more search
visibility.
PR
Another way of bringing people to your website is to begin a PR
campaign. This doesnt have to mean aiming at big publications it
could just mean trying to get other blogs to write about you or even
writing the content for them, otherwise known as Guest Blogging.
Write a few articles and send them to reputable blogs in the industry.
Getting published raises your profile and also provides valuable links
back to your website, which will raise you through the search rankings.
2 / Marketing
LANDING PAGES
If you are feeling confident on the SEO front, you could try to appear
high on the first page for key terms like Shopify designer [your
area] or [your area] web designer. These keywords are often highly
competitive, so this isnt easy, but its something you can work towards
improving over time.
MEETUP GROUPS
We started a meetup for Shopify in London and the response has
been tremendous. This is a great way to meet potential clients that are
considering Shopify as a platform or that are already on Shopify and
are looking for a partner to help with future work.
Organizing an event requires a lot of effort both in terms of marketing
and logistics. The main thing is to ensure you send regular email
updates in the run-up to the event so you can increase awareness. A
good list of talks will help draw the crowds. Youll probably need to
ploy people with free booze, so factor that into your costs. You dont
just need to limit your meetup to Shopify why not create a fashion
retail or designer-maker meetup in your city?
COWORKING SPACES
Coworking spaces are shared desk offices. Many of the newer ones are
impressive to work in and are typically full of interesting people trying
to build companies. This support network can be useful at the start for
sharing advice and contacts. You may even find you get some business
out of it. Join the mailing list and watch out for people looking for
ecommerce help. Another advantage of joining a coworking space
2 / Marketing
is that it can make you look a bit more professional when those first
clients want to come see you.
SOCIAL MEDIA
Social media can be a great way to show off your expertise and offer
real value to prospective clients. Here are some tips:
Do:
Choose one or two social networks to pay attention to. Its hard to
do all of them well and some work better for B2B, such as Twitter
and LinkedIn.
Use imagery where possible to liven up a post.
Consider using a person as your avatar and profile name, even
though this is your company account.
Dont:
Just show off your latest work all the time. You need to earn
the attention of your followers by offering something of value
beforehand, such as advice.
Go off topic with your tweets nobody wants to know what youre
eating for dinner.
Do include links to your social media pages on your website, but
dont go overboard and put a feed directly on your website. If
people have made it there, you want to keep them on your site!
2 / Marketing
CLASSIFIED LISTINGS
Some of our earliest clients arrived from Gumtree, a popular classifieds
site in the UK. We simply posted an honest ad explaining that we were
offering premium web design at a low cost so that we could build a
portfolio, and out of a few enquiries came a lot of work.
2. Nurture prospects
If the person is ready for a new project straight away, we skip straight
to the next step. However, most people arent ready to buy right away.
They are researching a potential project or they may have stumbled
across your site for some other reason. If your conversion rate to
enquiry is 2%, this means 98% of the people visiting your website are
then disappearing!
How can we retain some of those visitors so that they come back?
What Id suggest is creating a lead magnet that is irresistible to your
target audience. Create a killer long-form article such as 5 ways to
instantly attract more customers and ensure it is prominent within
your website. You could even use a modal pop up. Ask for an email
address in return for accessing the article; that way you can begin a
mailing list of interested leads. Note that the lead magnet has to be
something that would be appealing to your target audience, to ensure
the leads you get are relevant.
Even in the age of social media, email addresses are gold. They allow
you direct access to your audience and over time you can build your
brand by sending useful and informative content to your mailing list.
2 / Marketing
This type of content is great because it simultaneously builds your

brand and provides utility to the prospective client.
Send out your best new blog content to your mailing list and youll
notice the perception of your brand will improve. Best of all, you may
even get people recommending you that havent met you, but are just
reading your content! We actually individually email each new lead
that downloads our lead magnet with the following:
Hi [name],
Thanks for downloading [lead magnet]. Are you considering a
new ecommerce website? Our ecommerce websites feature:
Mobile, tablet and laptop friendly design
Easy to use admin screens
Powerful selling features like personalized product
recommendations
Analytics and reporting
Ongoing support
SEO and paid ad management services if needed
Point of sale (POS) terminals, if you need them
Please get in touch if this is of interest, the next stage is a free
consultation from which we can prepare a proposal for your
project. If you have a project in mind please email us and we
can provide a quote.
2 / Marketing
Youll often get replies and out of these a dialogue around a future
project could begin.
3. Making a sale
Now we arrive at a critical step! How do we convince this potential
new client that we can deliver what they need? Once we have a bit of
information on what they are trying to achieve, we send a proposal
(see Chapter 3 on writing a killer one!).
Make sure you follow up a couple of weeks later. Website projects have
a habit of slipping down the priority list for clients, until they become
urgent! Stay in the loop with your leads and dont worry if you dont
win every deal. If this happens, find out why you werent chosen and
improve on it.
4. Repeat business and referrals
Youve got your first client! Congratulations.
Dont forget that the Lifetime Value of a client may be far more than
the initial project. Once youve done an excellent job of delivering
the project, catch up with the client on a regular basis to see how the
website is performing.
Referrals are probably the easiest way to your grow your business, so
think about how you can create a process that encourages clients to
refer other leads to you. Most retailers will know others that could
benefit from your services.
2 / Marketing
Measuring your success

Always measure your key activities. Create key metrics for each part
of your funnel, such as how many new subscribers you have, what the
click through rate of your emails are and which marketing channels
your new projects are coming from. Then refine what marketing
activities youre doing by taking this into account.
Final thoughts
Never stop learning and improving. Finding your first customers will
be a huge learning curve but its just the start. Good luck. Go forth and
build your ecommerce consulting empire!
2 / Marketing
3 / The Proposal
How to write and present

proposals that close deals
by Ross Beyeler
Since 2008, Ross has run Growth

Spark an agency helping
ecommerce companies design
interfaces that convert visitors and
streamline operations. Growth
Spark has completed over 250
projects, with Ross named as
one of BusinessWeeks Top 25
Entrepreneurs under 25 in 2010.
If youve spent any time running a freelance practice or web

agency, youve likely been asked to present a proposal for
your services. If youre like many firms, you whip together
a quick Word Doc with a list of the things your client told
you they wanted in their website and how much its going to
cost. Unfortunately, this method is likely to fail in producing
a 100% close-rate. In this article, we take a look at best
practices in crafting and presenting your proposal to help
you increase your odds of winning a deal.
Why write a proposal?

Will an awesome proposal win you a project by itself? Unfortunately,
no. Could a crappy proposal lose you a project? Unfortunately, yes.
Not all sales opportunities will put you directly in front of the sole
decision maker where just a call/meeting/email alone can close a
deal. Its very likely that youll need to submit some sort of proposal.
Its very likely that youll be competing against other agencies. Its
3 / The Proposal
very likely that your proposal will be circulated around to other

stakeholders that might not have met you and dont have context/
background on your company. Because of this, youll want to make
sure youre putting together and delivering your proposal in the best
method possible.
Whats really the goal of a proposal?

The first mistake I see other agencies making is rushing through the
sales process so they can get to the proposal as quickly as possible. At
its core, a proposal is a tool to help you express your understanding
of your clients problems and needs. If you dont take the time to
thoroughly identify those problems and needs, chances are your
proposal will fall flat with clients.
Even if your process/deliverables are almost 99% the same for every
client, you need to craft the proposal in a way that matches the
language and perception your client has of their problem. You might
suggest the same solution for each of the following problems:
A client needs a better way to manage the content on their website.
A client needs to integrate their ecommerce website with the other
tools/software they use to run their business.
A client needs a design that is more focused on conversion and
helps drive sales.
In each of these cases above, you might still end up designing and
developing a new custom Shopify theme, but the core problem youre
3 / The Proposal
solving is actually quite different for each. You want to sell the content
management guy on the ease of product and page management with
their chosen ecommerce platform, even if you need to build the same
custom theme you would for the platform integration guy. Its crucial
to remember that the real goal of your proposal is to demonstrate your
understanding of the clients issues and reason for the project.
Getting to a proposal
So how do you properly assess the problems and needs of your client?
Although this article isnt meant to provide sales process strategies,
here are some of the key steps that most agencies experience as theyre
selling a potential client:
Qualification
Once youve received an inquiry or referral, your first step is to
qualify them and determine if theyll be a good fit as a client. Youll
want to get a sense for the constraints/requirements theyre dealing
with on the project regarding budget (how much cash do they have
to solve this problem?), timeline (are there any driving deadlines for
this project?), technical (what are the high-level features needed?)
and partnership (are they looking for specific attributes in the partner
theyre looking to work with on the project?).
Defining the problem and requirements
Once youve determined theyre a good fit at a high level, youll need
to dive into understanding whats driving the project. Youll want to
figure out what business problems theyre facing, the magnitude and
3 / The Proposal
impact of those problems and why theyre choosing to do something

about it right now. Youll also want to dive into a full breakdown of all
the technical requirements surrounding their problem.
Scope analysis
Once you understand the problem and requirements, youll need
to draft some sort of solution. This solution might only need to be
explained conceptually or as a list of defined requirements and not
necessarily approached using any spec work (I highly recommend
avoiding spec work at all costs). Youll want to determine the process
and methods by which youll be solving their problem once theyve
moved ahead with the project.
During each of these steps, I suggest having at least one interaction
with the client either face-to-face (ideally) or via Skype/phone. Do
not create a proposal for anyone not willing to communicate either in
person or via phone. You wont win any email-only deals.
What does a proposal look like?

Ive seen a variety of proposal structures, styles and formats. At the
core, however, most proposals seem to focus on the following areas:
Company
This is your moment to brag and demonstrate why youre the perfect
fit. Youll want to answer questions such as:
What makes you an expert on this subject? What experience/
accolades do you have that set you apart?
3 / The Proposal
Who is on your team and more importantly, who will the client
work with specifically?
What philosophy/approach/secret sauce do you have that makes
you a good fit for this project?
What other case studies/references/testimonials do you have that
can help instill trust?
Problem
This is where you demonstrate your full grasp of the problem your
client is trying to solve. Youll want to answer questions such as:
What are your clients key business issues and objectives?
How do you measure the impact of both solving or not solving
those problems?
Why are these problems being addressed now? What is the real
motivation behind the project?
What has the client said regarding the partnership requirements
they have, and how do you meet them?
Solution
This is where you want to demonstrate your insights and ideas
(without giving too much away for free) on how youll solve the
problem. Youll want to answer questions such as:
What are the business goals youre trying to accomplish in solving
this problem?
3 / The Proposal
How will you measure success when looking at how you solve the
problem?
What constraints or limitations have been identified regarding how
the problem could be solved?
How do you differentiate between mission-critical requirements
and nice-to-haves? What are those requirements?
What is the process or series of steps/phases youll take to solve the
problem?
What tangible deliverables will be produced while following your
projects process?
Logistics
In this final section, youll want to get into the specifics on how the
project will be executed. Youll want to answer questions such as:
What are the costs in fees, platforms, media and additional services
in the project?
What is the payment schedule and how does that correlate to time
or deliverables within the project?
What is the expected timeline for the project and what drives the
ability to stick with that timeline?
What will the communication policies/practices be like during the
project?
What other policies/contingencies/terms exist with this project?
3 / The Proposal
How do you present a proposal to a client?

Despite all of the above, I look at a proposal as one of two things: a
Presentation or an Artifact. A Proposal as a Presentation is one that
must be presented in context (i.e. in-person or over the phone) and
cant simply be sent over in an email. These types of proposals are those
that require your narration. There is a story to tell/sell and it must be
presented as such.
A Proposal as an Artifact is really just one that articulates everything
that has been already said and agreed upon during prior sales
conversations. This method requires that you get almost full agreement
from the client on the project before presenting them the proposal. In
this instance, the proposal then serves as more of a reference/recap of
what has already been discussed.
In either situation, there are a few tools I use that make crafting/
presenting proposals a little easier:
Proposal management
Ive used Tinderbox for years as my proposal management software.
They allow you to create templates with dynamic variables such as
client name, track analytics of how your client views the proposal, and
manage team collaboration.
Sales presentation
If I cant do it in person, I typically use a screen-sharing tool such as
Zoom to walk the client through the document. I prefer to not send
3 / The Proposal
it to them directly and instead control the viewing experience from

my computer. This prevents them from just jumping right down to
budget and making a quick decision.
Sales communication
If youve ever doubted whether a potential client has received or read
an email, check out Yesware. Yesware sits in your email client and
provides email templates and analytics to help you more effectively
manage your sales communication and process.
Sales management
There are a ton of CRM solutions on the market with Salesforce as the
notable leader. Personally, weve used PipelineDeals for years. Its a
far simpler interface and works perfectly for agencies who do projectbased sales.
In the end, everyone is bound to take a slightly different approach
to crafting their proposals. Regardless of your approach, there is one
thing Ive found crucial to remember. Dont get too comfortable with
your proposal templates. Its easy to think that once youve built a
great proposal you can go on repeat with all new deals going forward.
We work in an ever-changing industry and as such, your proposal
needs to change often too. In addition, you need to make sure that
each proposal speaks to the unique needs/problems your client has
identified. You cant assume your template speaks to those problems
flawlessly with every prospect, so keep it fresh!
3 / The Proposal
4 / Value-Based Pricing
Deciding how to charge

your clients
by Ben Crudo
After completing a B.Eng in

Software Engineering, Ben started
building websites and apps on
Shopify, and today he is one of
the top Shopify Partners. Ben is
the principal solution architect
at a consulting firm that bears
his name, and leads a team of
software developers on dozens of
projects annually.
Today Ben Crudo Consulting is an eight man (and counting)

development shop. We didnt start out that way though.
As our name would imply, you only used to get Ben Crudo
when you hired us.
When I began consulting, I took any job available in order to increase
the size of my portfolio and help build up my reputation. In an effort
to keep prices down, I would bill strictly by the feature. I found that it
was a lot easier to make a deal with someone based on the delivery of a
feature, since thats ultimately what the customer is interested in.
You have to be careful when making contracts with clients based on
features though this can be a double-edged sword. Things can easily
go awry if you dont scope out the requests in enough detail and ensure
that the customer has the same understanding of the project as you.
Since the customer is always right, you might be forced to repeat the
implementation a few times to make them happy, which can be quite
costly for you.
To protect myself from scope creep and errors in estimation, I always

provide a small range of costs in my proposals. Estimating the effort
involved in completing a software project is extremely difficult in
general, but it can be even more complicated if youve missed the mark
with your implementation. Maintaining a little wiggle room with your
pricing can make the difference between winning and losing on a
contract.
Trust is hard to come by in the software consulting business.
Developers are often compared to mechanics because they speak in
cryptic foreign languages, like HTML, JavaScript and Ruby, about
concepts lay people dont understand. Making sure that you and your
customer share a mutual understanding about what youre going to
develop is one of the most important things to do on a project.
As a matter of principle, no one likes to be told that they need to pay
more for something theyve already negotiated for. Thats why as a
company policy we guarantee our clients that their bill will not change
so long as the mandate remains the same. This means that as long as
we are effective at eliciting requirements from our customers in the
first place, well be able to estimate the workloads effectively and keep
them satisfied.
Unfortunately, like many things in life, this is much easier said than
done. Gathering requirements for a software project is an extremely
difficult task to complete accurately. To make things more difficult,
often times customers arent able to articulate their needs precisely,
making it even harder to craft a solution to suit their problem. Sadly
for developers, software is so fickle that even the slightest change in

requirements could spell a lot more work on a given task.
In the context of doing contracts on a set budget, the details really
matter. Whatever you can do to make sure that the customer
understands what youre delivering, the better off youll be. I would
suggest leveraging every tool at your disposal to clearly define the
functionality youll be providing to the client. Wireframes, mockups, UML and user stories all play important roles in specking out a
software project. Each document type you produce should describe
a unique aspect of the project. This demonstrates to your clients that
you have all of the bases covered and acts as a good start to your
implementation and project plans. It can also come in handy when a
customer comes back to you after six months with a signed proposal
that you may have already forgotten about.
Changing your pricing strategy from feature-based to project-based
happens naturally over time. At first my projects were just single
features, so it was relatively easy to price them out. Once the projects
started increasing in size and complexity, customers demanded that we
provide them with more comprehensive quotes. Unfortunately again
for consultants, its much more difficult to estimate a larger project
than a smaller one.
The number of deliverables you provide acts as a baseline for
the number of potential mistakes you can make. As it turns out,
experience is the best way to minimize the mistakes in estimation.
Once youve done everything at least once, you learn to recognize the
common pitfalls and will be much better at identifying sources of risk

in your projects.
Apart from making every mistake at least once, its a good idea to have
lots of documentation to guide you through the sales and development
process. The bottom line is that the better you are at understanding
your customers needs, and the more experienced you are at solving
similar problems, the better youll be at costing your projects and
making sure you come out ahead every time.
5 / The Contract
How to draw up
a client contract
by Ryan Foster
Ryan Foster is the owner of

RyanFosterDesign, a digital
agency specializing in ecommerce.
He creates custom Shopify
Themes and private Shopify Apps
for emerging and fast growing
brands around the world. He
works with high-profile clients
including Pebble and DODOcase.
A clearly written contract is an essential element of

onboarding a new client. Contracts dont have to be long,
scary legal documents I deliberately use a document that
is written in plain, easy to understand language but they
should clearly explain what both parties are agreeing to.
Keeping the contract short, focussed and easy to understand helps
reduce friction, allowing you to start the project quicker (and get
your deposit invoice paid sooner!). Without a contract, your client
may not clearly understand what they are paying for. You risk scope
creep (clients asking for more features without paying for the extra
work), late payment (or even non-payment) and confusion over
ownership, requirements and deadlines.
What to include and why

If you have provided your client with a project estimate/quote, then
you have already written half your contract. A lot of the information
your contract should include will probably be in that estimate.
5 / The Contract
1. Overview
Briefly describe who the contract is between (include company names
and addresses of both parties), summarize the project (We will design
and build a bespoke Shopify Theme) and the associated cost (...for
the estimated total price of $$$).
2. Responsibilities
Describe what both parties agree to (e.g. client confirms they have
the authority to enter into the contract, will review work and provide
feedback in a timely manner, will stick to the payment plan you will
endeavour to meet deadlines and maintain client confidentiality, etc.).
3. Scope
Detail all the project deliverables. This is really important because
it explains to the client what they are getting for their budget. If you
are providing design mockups, explain how many mockups you
will include (1 main design concept and up to 3 rounds of design
revisions). Explain what browsers and devices you will support (you
are testing your pages in Safari 5 on Windows right?).
Describe how user acceptance will work so everyone is clear how
deliverables will be approved as you work through the different
project stages. This will help the project progress smoothly. As well as
describing what is included in the project scope, describe what is not
included (We are not responsible for inputting product, blog or page
content to your store). This will help to avoid the awkward Really?
I thought that would be included... conversation at the end of the
project.
5 / The Contract
4. Changes
Inevitably, things change so you should describe how you will manage
this change throughout the project (The design stage includes
three rounds of design revisions. Additional rounds of design will
be charged at our standard hourly rate of $$$. All changes should be
requested in writing via email or Basecamp).
5. Ownership
Describe how the rights to the work produced are assigned on
completion of the project. Do all ownership rights transfer to the
client? Are you handing over source code? Make sure you include a
sentence about reserving the right to showcase the project in your
portfolio.
6. Payment plan
Include a payment plan with payments associated with different
project milestones. I always ask for an initial project deposit (to book
the work into our production schedule and secure a project start date
this ensures both parties are serious about the project) and then
staged payments (e.g. payment #2 upon completion of design stage,
payment #3 on completion of build stage). Make sure you assign a
dollar amount to each of these staged payments in your contract and
then clearly set out your payment terms (otherwise you could be
waiting 30 days before you get paid).
7. Warranties
Once you have completed the project, you have been paid and the
website is live, how long will you troubleshoot issues and fix errors?
5 / The Contract
What happens when this period is over does the client have to pay
for your time? Detailing your warranty period will ensure your project
has a clearly defined end, and will prevent an overly long and painful
project handover.
8. Termination
If things are not working out, describe how the contract can be
cancelled (At the end of the design stage if you are not happy with our
work, you will pay us in full for everything produced to that point and
cancel this contract).
9. Signatures
Thats it! Both parties should sign the contract (its not binding if both
parties do not sign just sending the contract to your client is not
enough) and keep a copy for their records.
Contract etiquette
Its important to create a contract that is appropriate to the size of the
project. At the start of the article, I recommended keeping the contract
short and focussed. But in reality, the size of the contract will probably
relate to the size and complexity of the project. I think the important
thing is not to scare off a potential new client with an intimidating and
overly long contract! Keep things accessible.
Personally I believe it is more important to clearly explain what
both parties agree to in an easy to understand format, as opposed to
creating a 50-page document that will be water-tight and stand up in
5 / The Contract
any court of the land.

If you are terminating a contract, it is important to do so in a
professional manner that maintains the reputation of your business. If
you just send an email, it is easy to misinterpret or come across badly
make a call, explain why the business relationship is not working,
and follow up in writing with an email.
Templates and other resources

There are a lot of open source contract resources available on the web,
but here is a selection I have found useful:
Docracy.com
An open source collection of legal contracts. The website includes tools
for e-signing and all documents are free to download, customize, store
and e-sign.
AIGA Standard Agreement for design services
Sample designer contract by Speider Schneider
Contract for Design Works by Dan Wong
SuperFriendly agreement
Example agreement used by SuperFriendly, a US-based design
studio. Simple and easy to read, you can use this example as a starting
point to create your own agreement document.
5 / The Contract
Contract Killer
Contact Killer is a popular open source contract for web designers, by
Andy Clarke. Another easy to read, plain English agreement with no
jargon or legalise.
e-Signatures
Dont want to scan, sign and email back a PDF? Here is a selection of
e-signing services you can try instead:
Adobe Echosign
DocuSign
HelloSign
Right Signature
Is an e-Signature legal? According to Wikipedia, yes but it depends
on your country: In many countries, including the United States, the
European Union, India, Brazil and Australia, electronic signatures
(when recognised under the law of each jurisdiction) have the same
legal consequences as the more traditional forms of executing of
documents.
Each of the e-signing services linked above include information
about how their service is legally binding. Docusign outlines the
appropriate legislation for the United States, United Kingdom and
European Union.
5 / The Contract
F*ck You, Pay Me

A favorite video in our office. Mike Monteiro, Design Director and
co-founder of Mule Design Studio talks about the importance of
contracts at a Creative Mornings event.
And finally...
Over the last 15 years, 99% of client projects have run smoothly. But
when they havent, a clearly written contract has helped to clarify issues
and smooth out payment problems. The contract provides peace of
mind and protection for both partiesso dont start a project without
one!
Important: I am not? a legal advisor. While my company is happy to use
a modified contract template, this approach may not be appropriate for
you! Nothing in this article should be considered legal advice. Consult a
solicitor/lawyer to if you want to address the particulars of your specific
situation.
5 / The Contract
6 / Customer Service
The key to winning work
by Paul Boag
Paul Boag is the author of Digital

Adaptation and a leader in
digital strategy with over 20 years
experience. Through consultancy,
speaking, writing, training and
mentoring, he passionately
promotes digital best practice.
As web designers, we like to talk about the importance of

providing an amazing user experience. Yet we often fail to
apply these high standards to our own users: our clients.
Neglecting the experience of our customers is a mistake. Our sector is
being squeezed with everybody forced into the middle. At the bottom
end of the market, automated tools such as Squarespace are forcing
web designers to look for larger clients. At the top end of the market,
companies are bringing the web in-house. This is forcing larger
agencies to take smaller projects.
Providing great customer service is one of the best ways of differentiating yourself in a busy marketplace.
Why customer service matters

When a market becomes oversaturated, as we are seeing in web
design, it is not the best that survive. Instead, it is those who have the
best reputation. Providing outstanding customer service builds that

reputation.
If your customers have a good experience working with you, theyre
more likely to recommend you to others. This word-of-mouth
recommendation is invaluable because it lowers your marketing costs
and increases profitability.
They wont just recommend you to colleagues and acquaintances, they
will become excellent references. They will also be willing to provide
testimonials you can use in promotional material.
Happy customers also lead to more repeat business. Repeat business
is important because it is easier to win and that lowers your cost of
sale. Again, this increases your profitability and allows you to remain
competitive.
Providing excellent customer service also establishes a better working
relationship with your customers. This means they are easier to work
with, thus increasing your profit margin on design and development
work.
In short, customer service matters because it brings in new work
and makes you more profitable as a company. The question then
becomes: how do you provide outstanding customer service? It
begins by understanding which parts of the experience could do with
improvement.
Identifying points of improvement

Fortunately, as web designers, we are familiar with improving
the experience of our users. We even have a range of tools and
techniques to help us achieve this aim. One such tool is the customer
journey map. As the name implies, a customer journey map seeks to
understand the customers interactions with a company. It is a timeline
of these interactions which reveals what the user is trying to do and
how they are feeling through the process.
We can use this technique to map the experience of our customers and
look for opportunities to make things better.
Our customer journey map starts with our client researching web
designers, and ends with a post-project debrief. Along the way, they
have many interactions with us. Each one is an opportunity to create
a better experience. But to achieve that we need to understand at each
touchpoint what the user is thinking, feeling, and doing.
Lets begin by looking at the customers experience of finding and
selecting a web designer.
Impressing in the sales process
The customers experience begins with the realization that they need
to hire a web designer. Customer service comes into play even at this
early stage. By providing good customer service to our existing clients,
they may well recommend us to a new customer.
But our new customer will also be doing their own research. If we are
giving away useful advice and information, we immediately make a
good impression. Use your blog, newsletter and social media to help
potential customers find the right web designer for them. We shouldnt
focus on promoting our products, but on answering their questions.
Give them advice on running their website or support them in any
other way you can think of. Dont just see them as a cash cow you can
make money from. Instead, be there to serve them from the beginning.
But dont stop there. There is much you can do when they ask you to
pitch for work as well. Dont use the tendering process to do whatever
it takes to win the work. Instead, be willing to challenge, give good
advice and encourage them in the right direction. Tell them if you
are not a good fit, because they may well come back to you another
day or recommend you to a colleague. Consider the challenges that
they face in selecting a supplier. Think about how they feel and the
questions that they have. Make sure you address these through your
documentation and presentations.
Even once they have offered you the job, consider their needs as you
negotiate the contract. If they need to spend their budget before the
end of the financial year, arrange early payment terms. Equally, if they
have a cash flow issue, talk to them about spreading the payment.
Examine every step of the sales process and look for ways to
improve. This will go a long way to making a good first impression
an impression that will help shape the relationship through the
production phase of the project.
Customer service in production

Once you have won the project and production is underway, we often
forget the clients needs as we focus on delivering. Unfortunately,
this is where we can often damage the relationship. We need to once
again look at each step and ask ourselves what questions the client
may have and how they are feeling about the process.
Take for example the initial kick-off meeting. Many clients have
not done a web design project before and do not know what to
expect. Even if they have, they have not worked with you and so are
unfamiliar with your approach.
They are nervous about the project and uncomfortable that they
do not know what is going on. It is our job to reassure them and
give them confidence in our ability to deliver. If we fail to do that,
the client will start micromanaging and that will damage the
relationship.
Another key touchpoint where customer service is crucial is when we
come to the design sign-off. Unlike ourselves, clients are not experts
in design and yet we ask them to approve work.
With no experience in design and the pressure to get it right, it is
unsurprising that customers ask colleagues. That, or fall back on their
personal opinions. Once again they are uncertain and nervous, yet
too often we do nothing to reassure them. Instead we get frustrated
because we do not like their feedback.
Once production is underway there are often extended periods of

time when we have our heads down. Our minds are busy fighting with
Internet Explorer or wrangling jQuery. At these moments, the furthest
thing from our mind is customer service. We focus on delivering, but
we cannot forget how the customer is feeling.
We need to keep communicating with our client throughout this
production period. When they do not hear from us they can only
presume we are not working on their project. They have no perception
that progress is happening. As a result, they become more nervous
about delivery. If we are going to prioritize the customer experience,
we need to keep customers informed. We need to communicate at
least weekly. We need to reassure them that the project is in hand and
progressing.
There are many other touchpoints like these through the production
process; points where we can provide a better customer experience,
from helping the client with content to guiding them through
launching the site. We need to always be aware of their needs and
feelings. But customer service should not end when the project is
complete. We should always be providing outstanding service.
Providing post-project support
How we end the project is as important as how we run it if we wish to
provide a great customer experience. Even if we did a great job on the
website, a client can go away unhappy if we abandon them. A project
debrief meeting is a great way of drawing the project to a close. Its an
opportunity for the customer to express any questions or concerns
they have. Its also an opportunity for you to show that you value
their feedback and wish to continue working with them over the long
term. You can discuss ideas that both you and the client had during
production that were outside the scope. You can also give them advice
about managing their website over the long term.
But even after the debrief meeting, you need to continue to offer
outstanding customer service. Their experience with you will fade over
time if you do not continue to be there for them. This means they will
be less likely to recommend you or act as a reference. Make sure you
check in with them often. Let them know about any new innovations
that may be applicable to them and ask how things are going. Keep
them informed through email newsletters and blog posts. It is your job
to make them feel they are up to date with the web. If this is sounding
a bit touchy-feely to you, then you might be misunderstanding what it
means to be a web designer.
More than building websites

Many web designers see their job as delivering a product. We build and
launch websites. This would make us part of the manufacturing sector.
But in truth, we are part of the service industry.
When you go to a restaurant, you are not just going for the food. You
can make food at home. You go for the service and the atmosphere.
The experience matters as much as the final deliverable (the food).
That is how customers experience working with us. The final
deliverable is important, but so is the experience that goes around
it. We need to put as much attention into shaping the customers

experience as we do into shaping the users experience on our websites.
By using tools and techniques such as customer journey maps, we can
better understand our customers. This allows us to start enhancing
their experience. Yes, this kind of planning takes time and effort. But it
is still more cost-effective than having to deal with unhappy clients and
being forced to seek out new ones.
7 / Mobile
How to optimize clients

stores for mobile
by Galen King
Galen is founder and Creative

Director of Lucid, a design
and development studio
based in New Zealand. Lucid
specializes in graphic design
and branding, as well as web
design and development. Lucid
is a leading Shopify Expert and
has been designing, building and
developing ecommerce sites on
Shopify since 2006.
When designing and developing online shops, it is

increasingly important to consider what devices your clients
customers will be using not only to view the site, but to
order, check out and pay.
We can see in the stats from one of our clients shops that mobile traffic
now accounts for 50% of the visits. But whats interesting is that, in
terms of revenue, only 35% of visitors made a purchase on a mobile
device vs. 54% on a desktop.
What does this tell us? Well, it may indicate a number of things:
perhaps more people tend to just browse on their phones; or maybe
the ordering, checkout and payment flow is not as highly optimized as
it could be for mobile users.
So, how can we optimize our clients shops for the best browsing and
ordering experience on all devices?
7 / Mobile
The first thing to consider is whether you intend to build a completely

customized mobile experience separate from the desktop site or
whether you will simply optimize the mobile experience. The latter is
referred to as responsive design because we are developing the site
to respond to the different screen resolutions.
Id prefer not to get into the debate over the pros and cons of
responsive vs. dedicated mobile sites, but the trend for most small to
medium-sized sites is to go with responsive design. This is definitely
our preference at Lucid, and the focus of this article.
Things to consider when developing a

responsive site
Do you need a totally unique experience on mobile devices?
Or is it enough to simply tweak the layout for smaller screens? If you
feel you need a totally different workflow for mobile, think carefully
about whether responsive will in fact work for you. Or rethink
your workflow. Keep it simple. Keep it intuitive. Small UX and UI
modifications are often sufficient and perhaps you can rework certain
areas of the desktop interfaces to better accommodate the mobile
experience. If the site is so complex it wont adapt to mobile, maybe its
time for a refresh overall.
Might you need to eliminate some of the content on smaller
devices to simplify the experience?
If you do this, bear in mind you need to be careful not to remove
anything that is vital to the overall experience and brand story. Its
7 / Mobile
also worth considering whether your content is too heavy in the first
place even for larger screens. Its important to have consistency, and
dumbing down your content for mobile might not be in the endusers best interest especially if they might eventually view the site
on both mobile and desktop devices.
How will your navigation work on different devices?
If you have a complex menu structure, perhaps with multiple levels
of nested items, consider going back to your content strategy and
working out a better way to simplify it overall. Regardless of whether
the site is for mobile or desktop, we always try to avoid having more
than one level of nested content its easier to build and its definitely
easier and more intuitive for users.
Are clickable elements easily tappable?
A finger is larger than a mouse pointer and the element being tapped
on will be obscured by the finger. Be sure elements that need to be
interacted with are big enough and have adequate spacing on small
screens.
How will you handle layout of grids and images on different
devices?
Its common to change the number of columns depending on the
screen size. But something important to consider is how this might
change the layout and balance try to avoid having widow
thumbnails on smaller devices because the number of columns doesnt
divide evenly into the total number of items. This isnt always possible,
of course.
7 / Mobile
Are you using vector icons or icon fonts?

If youre not, you probably should be.
Are your images beautiful and crisp on retina screens?
This is no longer the domain solely of iPhones and mobile phones, as
retina is fast becoming standard on new laptops and desktops.
Definitely consider the impact on bandwidth and speed of large,
retina-resolution images.
This is tricky and there are no industry-standards or best-practices yet,
but it appears that the srcset attribute may be emerging as the best way
to handle this. The lazy way is to always serve the largest image you
will require, but this causes unnecessarily overweight pages which is
especially hard on mobile data users.
Do you have big, bold, beautiful banner images or sliders? How
will they look on a small screen?
If they have words overlaid, consider rendering the type using HTML
and CSS rather than embedding in the image so you can then optimize
the text for different screen resolutions. Text embedded in the image
could well be unreadable on small devices. On some of our themes,
we actually move the text off the banner image on small devices and
display it below so it can be large and bold without obscuring the
image.
Does the site have a complex header, large logo, sidebar or
information-filled footer?
How will you strip this down and simplify it on smaller screens?
7 / Mobile
What can be hidden or collapsed into the hamburger menu? If you

have important call-to-action buttons on the desktop site, does the
functionality get significantly diminished if you hide this button by
default? Should it live outside the collapsed menu?
Do you have hover effects on links or buttons?
If these are vital to the user-experience, be sure to consider how this
will work on touch devices that dont have hover. Better yet, dont
rely on hover effects for key functionality and reserve for subtle
enhancements only.
Are sliders and popups/modals optimized for small screens and
touch devices?
Even if your sliders have left/right arrows, its worth considering
whether you can optimize these to work with swipes as its a nicer
experience for mobile users and navigation arrows can obscure the
image on smaller screens.
Are forms optimized for use on small devices?
Are field labels still visible and does the user-view zoom in
appropriately when the user taps on a field to enter text? What about
field types? Are the appropriate device keyboards triggered for each
field i.e., numbers, URLs, email address, text, etc.?
Is the add to cart, checkout, and payment workflow optimized
for different screen sizes?
This is crucial. If the customer can happily and intuitively browse
the website but cant easily add products to their cart and check out,
7 / Mobile
chances are conversions will suffer. Make sure you spend time going
through the entire ordering workflow (right through to payment) to be
sure it works beautifully on all devices.
Recommended reading
All the books by A Book Apart are excellent and highly
recommended. But, in particular, we recommend reading Responsive
Web Design by Ethan Marcote and Responsible Responsive Design by
Scott Jehl. And, if youre working in or running a creative studio (in
fact, if you only read one A Book Apart book) definitely read Design is
a Job by Mike Monteiro!
7 / Mobile
8 / Invoicing and Payment
How to make sure

you get paid
by Kurt Elster
Kurt Elster is a co-founder at

Ethercycle and a passionate
designer with an obsession for
growing businesses. Chicagobased Ethercycle has expertise in
both design skills and business
acumen, specializing in high-end
responsive websites. Last year, the
websites they designed received
over 12 million visitors and $10
million in revenue.
I have a confession: I think invoices are exciting. I know,

it seems like accounting drudgery, right? Let me open
your eyes to the wonderful world of sexy invoicing. Yes, I
said sexy. Invoices arent accounting nonsense, theyre a
powerful tool that can demonstrate professionalism to your
customers and most importantly: get you paid!
In the U.S., there are no laws around what has to be on your invoice. I
recommend some standard things to start:
1.
2.
3.
4.
5.
6.
7.
Your logo
Your contact information
The date the invoice was first sent
When the invoice is due
What the invoice is for, broken down into line items if necessary
How to pay you
Who its for
I go one step further and include my businesss Tax ID to make record

keeping easier for the client and reduce any potential delay in payment
by having them ask.
If youre a designer, you probably want to design your invoices and
send them as one-off illustrator documents. If you send one invoice
a month, thats fine, but if youre sending them weekly or daily, fight
the urge to reinvent the wheel and use a cloud invoice software to save
yourself a ton of time.
I personally use and love Hiveage, but Freshbooks is equally good,
and Harvest is powerful, especially if youre doing time-based billing
in teams. Of the three, theres no wrong choice. Theres more than
just those three of course, but Im only recommending the ones Ive
personally used.
As for payment options, you want to make it as easy as possible for
clients to give you money so offer three payment options: Credit Card,
PayPal, or check by mail. Your clients will likely pay in that respective
order too. I love getting paid via credit card because it means the least
amount of effort for me; Hiveage lets me know Ive been paid, and
Stripe deposits the money in my checking account. Boom.
Alright, thats the technical stuff. Now how about the fun stuff like
email templates?
Here are the templates I use every day with my business invoices:
New invoice notification

Account Alert: Invoice [invoice-number] is now available for
payment
Hi [primary-contact-first-name],
Your invoice for [invoice-summary] is now available. To pay
your invoice now, visit: [invoice-url]
If you need anything, or have any questions at all, were here to
help. Just reply to this email. Thank you!
Payment receipt
Account Alert: A payment was received
Hey [primary-contact-first-name],
Thank you for your payment! Details below...

Date Received: [paid-date]
Payment Amount: [paid-total]
Receipt: [receipt-url]
If you have any questions or comments, just reply to this email.

Thanks again! In order to maintain the high quality of our work
(and to provide valuable feedback), we ask that you fill out this
short review form.
Payment reminder #1
Account Alert: Your payment is due today. [Invoice [invoice-number]]
[primary-contact-first-name], the payment date for your

invoice is today. To keep [business-name] in good standing,
please pay by end of day.
To make a payment now (and avoid service interruption,)
please visit: [invoice-url]
Thanks for being a valued client!
Payment reminder #2
Account Alert: Payment reminder for overdue invoice [invoice-number]
[primary-contact-first-name], the payment date for your invoice has past.

To keep [business-name] in good standing (and avoid service
interruption,) please pay now at: [invoice-url]
Lets talk about an uncomfortable truth: overdue invoices. I send my
invoices with net-15 terms. That means customers have 15 days to pay
before the invoice becomes overdue. A client not paying is a risk we
take as freelancers, but we can minimize risk. I never work without

a minimum of a 50% deposit, and I always offer a 10% discount for
clients who will pay 100% upfront (and at least half pay upfront.)
Here are some notes you may want to include with the invoice
depending on the situation:
Once your deposit is paid, your next steps are to invite us to your
Shopify store. Heres instructions
Know someone else who could benefit from our service? Referrals
are the best compliment you can give us.
Want the latest news on improving your Shopify store? Sign up for
our exclusive client-only newsletter
Do you see what weve built here? Its more than just invoicing, its a
semi-automated system that gets you paid with the highest level of
customer service and professionalism. And thats why I love invoicing.
9 / Your Business Toolkit
Recommended
apps and tools
by Ben MacGowan
Ben is the UI Evangelist for UKbased agency Creative Jar, with a

passion for front-end technology,
standards and process. Ben brings
user interfaces to life using the
best cutting-edge tools the web
has to offer. Hes the organizer
of Breaking Borders meetup and
ConfConf a conference about
running conferences.
Making sure you have the right toolkit at your disposal can
make a whole world of difference in the final product. We
are going to take a gander at an array of tools and services
which could find a place in your virtual toolkit all the way
from concept to launch, and even a bit beyond.
Communication
Whether you are working on your own, in a large team or with a client,
communication is key in any project. Its important to create a space
to let your ideas and progress be documented and shared, so they can
evolve and benefit from feedback. Be sure to pick a communication
tool at the start of your project and stick with it throughout.
Basecamp
Basecamp has been around since 2004 and had a big overhaul in 2012,
which saw a whole heap of new features and a beautiful new interface
introduced.
With Basecamp you can invite your whole project team, start
discussions, share assets and assign tasks with due dates. With access
available via browsers, native applications on Android and iOS, and
email support, its available when you need it to be. This tool will be a
natural fit in your working day. And if its good enough for NASA, its
good enough for your store right?
Slack
For times when more rapid discussion and collaboration is required,
there is a relatively new kid on the block which is picking up a lot of
momentum. Slack is team communication for the 21st century.
Once set up, you can create channels for your teams to be a part of:
projects, groups, topics, even products that are part of your product
line. Channels include the ability to send messages (as you would
expect from a chat platform), but also files, inline images and video,
and integration with everyday services such as Twitter and Google
Drive. This makes it the perfect tool for quickly sharing ideas, sparking
debate and getting feedback throughout the development of your store.
InVision
At some point during the production of your store, there is going to
come a time when you have static visuals you need to store, share
and invite people to give feedback on. Whilst the other services I
mentioned already allow you to do this, InVision takes it further by
allowing you to create interactive prototypes setting up hotspots on
the files that you upload.
Invited users and team members can then leave design feedback
directly on the design and create a conversation. This process allows
for more rapid feedback response, but also collates it into a single
location for your consumption.
Wireframing
Before you put pen to paper (or in this case, start to decide on the
colour palette and font combinations to use on your store), it is
recommended that you spend some time making sure you lay out all
your content first.
This is important not only to make sure that the hierarchy of
information is correct, but also that the interface is usable for your
users. At the end of the day, you want to make your customers
purchasing experience as easy as possible so that they may come back
again to purchase in the future.
Balsamiq
Balsamiq is a rapid wireframing tool with both a desktop and web
version. Create interactive prototypes and develop an idea of what
your interface could look like quickly with handy tools. You can even
drag and drop common UI elements from the Balsamiq User Interface
Library.
Once you have created your wireframes, you can export them to share,
collaborate and test with your clients and customers.
There are of course many alternatives out there, but Balsamiq ticks the
box of allowing you to quickly make your ideas come to life, iterate and
move further down the line of creating your store.
Designing
Designing is obviously one of the more crucial points within the
production of your (or your clients) store. Its when you take your
previously created wireframes and begin to bring them to life.
The industry is pretty dominated at the moment with two main
options of web design software: Adobe Photoshop or Sketch. The
likelihood is that youve already chosen which you will be going with
(and it may be something different than these two), so we wont go into
these much more.
However, it is worth looking at the extensions and plugins which are
available to improve your workflow when designing and moving into
the development stages of producing your store.
Photoshop
Font Awesome PS: Font Awesome icons, again right inside
Photoshop for quick and easy access and use within your designs.
Subtle Patterns: A library of subtle patterns fed directly into
Photoshop for you to use.
GuideGuide: Quickly generate guides based on your grid set-up
and selection.
Duplllicator: Clone layers or groups and shift them horizontally or

vertically easily with this extension.
Sketch
Sketch-Button-Smith: Quickly generate buttons from text layers.
Style Inventory for Sketch: Create an inventory of text styles
(as you later would in your CSS) to keep consistency across your
interface.
Scale half/Scale double: Scale the currently selected object in half/
to double its size. Handy for creating retina assets for your store.
Development
Due to the open nature of Shopify and its development process, there
arent many restrictions as to the development software of choice
and in this industry there are far too many for us to go into in this
article.
Coda, Sublime Text, TextMate and Visual Studio are amongst some
of the more popular options available. If you havent already got your
weapon of choice, I would recommend checking those out first.
Shopifys templating language of choice is Liquid, therefore it is handy
looking for an editor which supports (or has an extension which adds
support) syntax highlighting this will ensure easier development
and debugging on your part during the development process.
Liquid support for Sublime Text: Does exactly what it says on the
tin.
Django Template Language: The recommended mode for the best
Liquid syntax support in Coda.
Back in 2012, Shopify released its very own Desktop Theme Editor to
create the perfect companion to your code editor of choice. This app
allows you to work on files locally and automatically keep them in sync
with your Shopify store.
Compression and optimization

Throughout the development process, it is also important to think
about the final output and performance of your web store. Studies
have found that improving the performance of a website can increase
customer purchases and conversions, so here are a few tips to help you
with this.
Your store is all about your products, so most likely the interface you
are producing features a lot of product imagery. This is fantastic; you
should show your customers what they are buying. But this can also
be one of the main causes of a poor performing website large,
unoptimized images can cause a lot of the unnecessary download
times your customers are experiencing.
Using an image optimizer such as ImageOptim can heavily reduce the
weight of your images by lowering the quality to an acceptable level
(ever-so-slightly) and removing unnecessary meta data. Remember
though, dont just optimize your images during the initial development
of your store do this regularly, as over time you may add more
images to your store which need to be treated as well.
Carrying on the theme of reducing the weight of your stores assets,
CSS pre-processors such as LESS and Sass are a hot topic at the
moment. Not only do tools such as these make CSS a more colorful
and functional language, the output is often compressed to aid
performance.
Processors such as these can run directly from your Command Line,
or there are a number of GUI applications such as Scout out there if
you are not comfortable.
Grunt
For the more advanced developers out there, look into Grunt tasks to
compress and optimize your stores template assets. Here are some to
add to your tool kit:
Minify your CSS
grunt-contrib-cssmin
Minify your JavaScript

grunt-contrib-uglify
Optimize png and jpg images

grunt-img
Minify SVG
grunt-svgmin
Mixture
If you are looking for something which simply does all of the above,
with little set up and great results, then I recommend looking at
Mixture. This Windows and Mac application is a great all-around tool
with many features to aid you in your front-end development, some
of those being JavaScript compression, CSS processing, and image
optimization which we discussed above.
Testing
There is nothing more frustrating for your customers than trying to
purchase a product through an interface which is broken on their
device. Therefore, once youve got your store to a certain point within
the development stage, its always a good idea to test your work across
a number of different browsers and devices.
We encourage people to test in real-world testing environments rather
than emulators I personally lost count quite early on in my career of
the number of times that things looked perfect within emulators and
screenshots, but were not functionally working in the real-world.
Browserstack
Browserstack is a great service which gives you instant access to all
desktop browsers across a number of different operating systems. This
removes the requirement for you to maintain a whole host of virtual
machines.
As an added bonus, if you are already using Mixture then you can
easily load your project and Browserstack directly from the tool.
Whilst Browserstack also provides access to a number of mobile
browsers through emulators, it is always great to see if you can get your
hands on physical devices. This can be a large expenditure for anyone,
but there are services such as Open Device Lab which make accessing
devices to test that much easier.
Launch
Congratulations! At this point, you should now be in a position to
launch your clients online store. By using some of the tools weve
looked at above, the process should have been simpler and seamless.
One last recommendation though. As designers and developers, we
should always be looking to improve the stores and interfaces that
we ship (and your client will love you more for it). A lot of online
commerce is providing a seamless experience even past the Add to
basket button.
Implement Google Analytics and Google Tag Manager throughout
your interface to make sure youre tracking user journeys, goals,
and clicks on key call to actions. This will give you great analytical
data about your design decisions and suggest ways of improving
your customer journey all the way through to the point of order
confirmation.
10 / Launch Checklist
Things to do before
the site goes live
by Mat Mullen
Based in San Francisco, Mat

Mullen has been designing
Shopify stores for the past four
years and has plenty of experience
working with small businesses
that need help setting up their
stores. During the day, he works
as a Product Manager of Slack
and sits on the board at The San
Francisco Social.
Preparing to launch a new site is typically the most exciting

part of a project but it can also be the most stressful. It
took a while to really get a good feel for all the potential
things that could go wrong during a launch and try to
anticipate them ahead of time. After working on close to
100 Shopify stores over the past few years, Ive come up
with a pretty good launch checklist that I use towards the
end of each project.
I work with a mix of clients. Some are brand new to Shopify and are
selling something for the first time, and others have existing stores
that just want an updated theme. Depending on the situation, I have
slightly different product launch checklists.
Heres what I try to do before and right after I launch a new site. It
doesnt always follow the same pattern, but its a decent checklist of
some of the more common things I try to take care of before a launch.
First off, has the primary domain already been added to the site? If
not, I need to make sure my client sends over their registrar info so
I can easily login when the time is right and add the CNAME and
A Records. I always try to make sure this happens a week before the
launch date of the site because for some reason or another, registrar
logins always seem to be forgotten.
Next, its time to QA the site to make sure that all the media queries are
working and the site looks good on an iPad and iPhone. Its one of the
first things that a client notices so might as well make sure everything
looks good ahead of time. It can be tedious, but clients love to send out
their new site to friends and family, so better make sure its going to
look good. Chrome Inspector is a great tool to help debug any issues
you might encounter as you test your site.
If youre building a new theme on top of an existing Shopify store,
youll want to make sure all the navigation links are pointing to the
proper places. This can be tricky when youre previewing a theme
because theres only one master navigation section, so sometimes this
needs to happen immediately after the site has been published.
Sometimes when Im building a site, Ill create custom page templates
which dont automatically get applied when the theme is published. Its
something I have forgotten in the past, so dont forget to update the
pages to the right collection, product or page templates.
Dont forget to do a test transaction to make sure everything is working
as planned with accepting payments and confirmation emails. With
Shopifys new responsive checkout layout, youll want to make sure

that youve selected the show storefront logo option.
Want to impress your client with better looking notification emails?
The default email styles for the Shopify confirmation emails are pretty
bland, so I like to use the free Email Template Creator app to create
better looking templates that are on brand with the store.
Once the store has launched, I always make a point of exporting
the finished theme and saving it to a Dropbox folder just in case
something happens to it down the line. I also recommend cloning the
theme in the store so that theres always an easy fallback if something
goes wrong with the main theme.
Last but not least, I look through the original proposal that I sent over
to make sure everything we discussed has been completed. Every now
and then, you have to remind a client that some of the work theyve
requested wasnt included in the original proposal, so its helpful to
refer back to the original from time to time.
An important thing that I try not to forget is that my business has
grown because of the positive reviews Ive received. To make sure my
clients are happy at the end of the project, I always try to make a point
of making sure every client feels empowered to update their own site
once it launches.
Once a site has launched, I schedule some time to either meet with
a client in person or through a screenshare to make sure theyre
comfortable updating their site going forward. I always make myself

available to help with more complicated updates or changes, but I like
to leave the product updates up to the client.
Once youre all set and done, dont forget to send over a request for a
review! A good customer review is worth its weight in gold.
P.S. Ive come to rely on a few helpful apps that I use during most
projects. Maybe some of these will help you.
Recordit
Recordit is a great app for taking quick video screencasts that you can
send to your clients. Its a super simple app to use and its free!
Dropbox
Dropbox is my go-to file sharing service. Its great for passing photos
and mock-ups along and keeps everything in sync.
11 / Shopify's Partner Program
Working with Shopify
The Shopify Partners Team
We help freelancers and agencies

grow their business by building
client stores, or by building apps
and themes on Shopifys platform.
One of the major decisions youll make as a web-based

freelancer is the ecommerce platform you choose to work
with. The decision will be different for everyone, and maybe
youll even work with a handful.
Perhaps were biased, but a strong contender to consider is Shopify
currently used by more than 150,000 merchants around the world.
Weve built a network of thousands of professionals just like you in our
Shopify Partner Program.
Whats that? Its a team of international designers, developers and
marketers working to make commerce better, and using Shopifys
platform to do it. We enable freelancers and agencies to build viable
businesses around Shopify by giving them all the tools they need to
succeed.
Our Partner Program is free to join. As a Shopify Partner, youll get
access to our in-depth documentation, workshops and webinars,
marketing materials, private discussion forums, and early insights

about Shopifys roadmap and upcoming features. Youll also have the
opportunity to become a Shopify Expert where youll be listed in a
marketplace where we send merchants who need help with design,
development or marketing.
When you sign up, youll be introduced to your dedicated Partner
Manager who will point you in the right direction whenever you need
help. You can open up unlimited test shops to fiddle around with the
platform, build a theme or app, or prepare your clients site before it
goes live.
Plus, youll earn revenue share for each client you bring onto Shopify
(or each app or theme you sell). On top of the contract price youll
earn from a client you bring onto Shopify, youll receive 20% of what
they pay us monthly for as long as they remain on Shopify. For apps
and themes you develop, youll earn 80% and 70% respectively from
each sale.
Shopifys platform is fully customizable and built using HTML, CSS
and our Liquid templating language which is easy to learn (weve got
lots of tutorials to help you out). You can sign up for our free Partner
Program at shopify.com/partners. We would love to have you.
Weve given you a lot of information here hope you can use it!
Thank you
When Shopify launched in 2006, we set out to democratize

ecommerce. Along the way, weve expanded our mandate our goal is
to help people grow successful and lasting businesses on Shopify.
That doesnt only include merchants. That includes the designers and
developers who have built their entire businesses around Shopify,
bringing us quality merchants but also building a sustainable career for
themselves.
Were amazed by the talented partners weve met along the way. They
constantly expand the boundaries of whats possible on our platform,
and challenge us to continually improve and innovate.
Thank you to the authors who contributed to this book. Your industry
intelligence is invaluable to us. We know a lot of newcomers will learn
from your expertise, so thanks for sharing it with us.
The Shopify Partners Team is made up of a bunch of people who are
passionate about the work they do and the people they do it with.
From us to you: commerce isnt going anywhere, so lets enjoy the ride.
Copyright 2015 by Shopify
shopify.com/grow
@shopifypartners
Copy editors:
Keir Whitaker, Dan Eveleigh,
Courtney Symons, and the Shopify
Partners Team
grow.
Vol. 1
Designers:
Travis Hines and Serena Ngai
No part of this book may be used or

reproduced in any matter without
written permission from the
publisher, except in the context of
reviews.
Printed and bound:

Flash Reproductions, Toronto
Taylor Brothers, Bristol
Every reasonable attempt has

been made to identify owners of
copyright. Errors or omissions will
be corrected in subsequent editions.
Hustle and hustle hard. Youve got this.
This guide has been lovingly assembled

to help you grow your freelance design
or development company by building
ecommerce websites for your clients.
shopify.com/grow

Grow

Uploaded by

Document Information

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Grow

Uploaded by

Copyright:

Available Formats

Vol.

A beginners guide to growing

The lives we lead are

Its where people go to shop, to find work, to communicate

1 / Branding by Alex Hunter

Deciding what your

Alex Hunter is a company

looking at you on the cover of a magazine. (Will we have magazines in

Ways to find your

Anyone that has push-started a car will know that the

What I dont recommend

Building a predictable funnel

is a big decision and for an established business, changing workflow

This type of content is great because it simultaneously builds your

Measuring your success

How to write and present

Since 2008, Ross has run Growth

If youve spent any time running a freelance practice or web

Why write a proposal?

very likely that your proposal will be circulated around to other

Whats really the goal of a proposal?

impact of those problems and why theyre choosing to do something

What does a proposal look like?

How do you present a proposal to a client?

it to them directly and instead control the viewing experience from

Deciding how to charge

After completing a B.Eng in

Today Ben Crudo Consulting is an eight man (and counting)

To protect myself from scope creep and errors in estimation, I always

for developers, software is so fickle that even the slightest change in

common pitfalls and will be much better at identifying sources of risk

Ryan Foster is the owner of

A clearly written contract is an essential element of

What to include and why

any court of the land.

Templates and other resources

F*ck You, Pay Me

The key to winning work

Paul Boag is the author of Digital

As web designers, we like to talk about the importance of

Why customer service matters

best reputation. Providing outstanding customer service builds that

Identifying points of improvement

Customer service in production

Once production is underway there are often extended periods of

More than building websites

it. We need to put as much attention into shaping the customers

How to optimize clients

Galen is founder and Creative

When designing and developing online shops, it is

The first thing to consider is whether you intend to build a completely

Things to consider when developing a

Are you using vector icons or icon fonts?

What can be hidden or collapsed into the hamburger menu? If you

8 / Invoicing and Payment

How to make sure

Kurt Elster is a co-founder at

I have a confession: I think invoices are exciting. I know,

8 / Invoicing and Payment

I go one step further and include my businesss Tax ID to make record

8 / Invoicing and Payment

New invoice notification

Date Received: [paid-date]

Payment Amount: [paid-total]