Product Development

Branding the Ball – a WordPress website

I mentioned in a previous post that “I’m not an expert but I have learned that for my customers, creating a website powered by WordPress has been the best balance of cost versus capability versus self maintainability. I can build it and they can maintain it, both with relative ease and aesthetic excellence. [snip] So BoogerBall.com will become a WordPress blog site and that is a story for a future post.” Here is that post!

I am a builder. I can’t escape it. It’s how God fit me together when he jumbled up some creativity, problem solving skill and passion to help others. After building many websites from scratch (mostly for customers that have moved on), I’ve learned that there are tools out there that can make it easier. WordPress is one of those tools. When you understand how WordPress (WP) works and learn your way around customizing it with Themes, Widgets, Plugins and Settings, you can coax it very quickly to produce a very functional, connected and professional website (www.swtuts.com is a WP site that I admire). My goal for every customer is to make them look good while using my skills to meet their technical needs. WP helps me reach this goal every time AND results in a website that anyone can customize/edit.

Installing WP on my server is easy because each hosted site has a selection of available tools called the EasyApps Collection. While WP is famous for its 5 minute install (which requires setting up the database and uploading the files manually), the EasyApps installation script on my host makes it even easier. When you initiate the script, it asks you a few simple questions and then builds a smooth sailing, easy editing, quick customizing, wonderful website in just a few minutes (sorry for the alliteration there, I got carried away).

First, WP needs to install in a folder on your web server and you need to choose a name for that folder. The default is “/wordpress”. I usually change it to something more generic like “/site” or something very specific to the site I’m building. The folder may come up from time to time in working with and sharing your site so you do want to choose carefully. Consider a link http://BoogerBall.com/wordpress/the_original_story.htm vs. the same link to http://BoogerBall.com/savem/the_original_story.htm. The former tells the world what tool you use to manage your site. The latter keeps it simple and adds some intrigue to your link. For BoogerBall.com, I will choose “bb/” as it is short and sweet and relevant (and not too gross).

Next, choose a login and password. This script creates both an SQL database and an initial WP admin user with the same credentials. Because WP is a database driven tool, your site loads fast and information you add to it can be used in many unique ways. Behind the scenes, it may seem more complex than a simple html site, but up front it is much simpler to manage (consider the work of changing the look of a simple html site – page by page vs. the simplicity of installing a new theme in WP – in seconds the whole site has a fresh look).

If your host has a script like mine, you will immediately want to upgrade your WP install to the latest version. WP has instructions on their site how to do this. If you’ve installed version 2.7 or later, the updates are automated (click and wait a moment). If not, you will need to use ftp to upload and download the latest files. For ftp, I recommend an easy tool called FileZilla – its free and it has a cool name that makes me think of a giant green lizard breathing fire into my website – making things happen. You will also need a text editor for a step or two.

Some people use WP as simply a blog tool. They have a regular “www…” site and then have a link to their blog “www…/blog”. I prefer to use the blog tool as the entire site, taking advantage of all of its cool features. To do this, you will need to configure WP to run from the root folder of your site so www… connects directly to the WP pages. This simple tutorial makes that possible.

As WP is primarily a blog tool, it’s prudent to understand how you might make it work for a fully featured website. Content on a WP site takes two forms, Posts and Pages. Pages are designed to be mostly static info that doesn’t change very often. Most WP themes have a menu bar that automatically makes a button for each Page. For the sites that I’ve helped launch, Pages are used for the About page, a Contact page, a Calendar (linked to a Google Calendar) or other basic but important information. Posts are designed to be the primary authoring tool for the WP site. Some of my customers use Posts to share what’s new or to document a monthly report. Articles such as this one are perfect for Posts. Posts are sorted on a WP site by date so they produce a running history of the content you’ve added. Posts have the ability to be organized with Categories and Tags which further extend the navigation possibilities. If you are selling something, each item may be placed on its own Post and each Post can have a Category (For Sale or Sold) which will help sort the content. There are many possibilities, but understanding Pages and Posts will help you make the most of WP.

WP has many additional features that make it a powerful ally in web design. Plugins are one of those features. Many free plugins exist that you can install directly inside your WP control panel. Some favorites that I use are Image Widget, Simple Hit Counter, Secure and Accessible PHP Contact Form and Subscribe To. If I have helped with your site, you already should have these installed. Themes are another one of those features. You can download and install new themes in a flash from inside WP. If you’re code savvy, you can customize a theme using the built-in Edit Themes tool. I usually find a theme that looks swell, download it and customize it to make it more swell. Another feature that makes WP a cool tool are just the basic WP settings that give you a whole host of controls over your site (including automatic search engine registration). Best of all, each of these features will be the subject of a future post (so much to say, so few keystrokes).

So there it is. It took me more time to ink out the words of this post (yes, I do write all of my posts on paper before “going online” – call me obsolete) than it took me to turn BoogerBall.com into a fully functional, searchable, Google savvy website. Now all I need is content and creating quality content is where your time should be spent. WordPress makes that possible.  Now that BoogerBall.com has its start as a WordPress site, the next step is to customize it.

Tags: ,

Thursday, July 28th, 2011 Product Development Comments Off

Branding the Ball – The Word Mark

Once your product has a compelling name, the next logical step is to extend the name into a compelling logo.  Our product is a story, “How to Make a BoogerBall“, and its primary delivery vehicle is the website, BoogerBall.com.  The focus for our discussion about logo design, therefore, will be a logo for BoogerBall.com.

In learning how to design logos for several customers, I continue to research logo design and I have found that there are some basic fundamental requirements for an effective logo.  You’ll notice that I did not say “good logo”.  This is intentional because the judgment of logo design is an entirely subjective thing.  I’ve designed a logo or two that were very effective.  I thought they were “good” but my customer did not. 

Here are the essentials:  an effective logo should be simple (representing the very essence of the product or service), memorable (unique in it’s market segment), re-creatable by others (skilled in the craft), scalable (legible at the size of a postage stamp and at the size of a billboard), use as few colors as is reasonable (the more colors, the more cost), and be recognizable both in color and Black & White.  Each of these general requirements has a rich history linked to the processes of printing, publishing, digital presentation and advertising.

A logo may be made of two different elements, namely the Mark and the Word Mark.  The Mark is a graphic of some type.  It may or may not include text elements.  The Word Mark is some amount of text that usually accompanies the Mark.  This logo has a Mark represented by the tilted “K” and a Word Mark represented by the text “Kirk Builders”.  Some logos are only made of one of these elements.  Often the desire is that the Mark becomes recognizable even without the Word Mark.  The challenge is to balance all of these fundamental requirements and actually design an effective logo.

So armed with this knowledge, where do I start?  Always start with what you know.  BoogerBall.com is a website whose purpose is to feature a story about how to make a BoogerBall.  The concept was developed from the mind of a guy with no sisters who was barely 20 when he became the father of a four year old girl.  He thought it would be fun to tease her about saving his boogers and 14 years alter he was still enjoying the idea of saving his boogers in a big BoogerBall for his daughter.  The original story appeals to people on two different levels:  first, as an actual step-by-step instruction about how to really make a BoogerBall and second as an absurd fantasy about what would happen if you actually saved your boogers for 14 years.  Both levels of appeal speak directly to one demographic – 12 year old boys.  Only a 12 year old boy would take pleasure in the thought of saving boogers in a BoogerBall for 14 years to give it to a girl, and only a 12 year old boy would have the interest in actually exploring how to produce a BoogerBall from household materials (alas, at heart, I am still a 12 year old boy).

Now, what does that all mean to the point of our logo design effort?  Well, it seems prudent that the logo feature an image of the BoogerBall itself as the Mark and the word BoogerBall(.com) as the Word Mark.  It also seems like a good idea that the logo be clean and zippy enough that a 12 year old boy would want to wear it on a shirt.

Developing a successful Word Mark starts with selecting a font (or type style).  Fonts are so important to an effective Word Mark.  The text needs to be appealing but readable, memorable but simple – the complexity of the font should not distract from the overall design of the logo.  I have collected so many fonts that it is sometimes difficult to choose just one.  I usually start with an idea (clean and zippy and appealing to a 12-year-old boy) and then jump into my favorite tool, The Font Thing.

On my computer, I have two folders of fonts.  First, like you Windows users, my c:\windows\fonts folder contains all of the fonts I’ve installed over the years. 

Second, my server has a folder 000.AVSI \800.Templates \806.Fonts that contains a host of additional fonts that I’ve purchase, downloaded for free or received through some software purchase.  The Font Thing is a tool that enables viewing samples from both folders with ease.  You can download this free tool here (if you’re running Windows 7 you should read this post about making it work on your system).  Once installed, you can type in the text you’d like to sample, adjust the sample size and scroll through every font you own.

After scrolling through hundreds of fonts I chose these six as being zippy and appealing to a 12 year old boy (me).  Using Adobe Illustrator, I started some Word Mark concepts.  With the word BoogerBall.com as the basis and the font as the main design element, we start a clean design using layers to accentuate the words.  The color green is an obvious choice for the text which is placed on the top layer.  Behind that. a layer of white that has a larger line width really makes the green text stand out.  Finally a layer of black outline at the back clearly defines the edges of the Word Mark.  Putting all these together gives some interesting choices for word marks.

An aside about color choice - this topic is worthy of its own post as there are so many ways to choose color and so many factors to consider.  In choosing the color green, I decided to return to my offset printing background and choose a common color of ink.  Many print shops offer colors of ink at no additional charge on certain days of the week.  This means that on Monday they will load up a press with Pantone® Red and Tuesday with Reflex Blue, etc.  If you want red printing you can have it for free if you can wait until Monday to have it printed.  Otherwise they will charge extra to clean out a press and put your special ink color in it.  I have a Pantone® chart (Pantone® is a brand of ink commonly used by print shops) that is one of my favorite tools to choose color.  From the chart I chose Pantone® Green as the basic color of my Word Mark.  Illustrator enables accurate color choices of Pantone® colors by using the built-in Swatch Libraries.  My basic Pantone® Green is RGB 0-168-144, CMYK 100-0-59-0.

Back to the font choice – LetterheadFonts.com produces some of my favorite fonts.  Although I’ve not had the resources to purchase many of their excellent fonts, I do own a few that I love.  Speedstyle is a font that is commonly used to write driver’s names on their race cars.  It’s just the font that I think would look clean and zippy on a shirt.

So here’s the Word Mark that I came up with.  It’s not perfect but i think it’s effective.  The next step (for another post) will be to add a graphic (the Mark) to complement the Word Mark – probably an image of the BoogerBall itself.

Tags: ,

Wednesday, January 5th, 2011 Product Development Comments Off

Branding The Ball – Going Online

I’ve read various articles in the last few years touting the importance of having a “web presence”.  One online marketing expert suggests that all of your marketing efforts point your customers first to your website.  There they should be able to easily learn all about you and your products in a self-serve fashion.  Educate your customers before they call you and you will be more efficient with your marketing efforts.  In fact, they may not even need to call you.  My experience is that every company uses the web in a different way and I have yet to close a sale without a few phone conversations (and often a face-to-face visit).  God made us to need each other (remember the Love your Neighbor command?) and most people just like to talk to other people.

That being said, a website is an easy way to get the ball rolling when it comes to communicating with people, assuming your target audience is “online”.  Since the product I am trying to market is really nothing more than a story (How to Make a BoogerBall), and my target audience is curious people like you, I really need a dedicated website to make it available to the public.  As a product development consultant, I’ve developed a few websites in my career (printncut.com, daleblanshan.com, samuelschutz.com, jasondionne.com, larishconstruction.com, mattwhit.com, etc.).  Most of my potential customers know they want a website but don’t always know what’s involved to have one, so here’s a bit of info about actually owning a website.

Some background first:  The Internet is nothing more than thousands of computers all over the world all connected to each other in one big network.  A website is nothing more than a small clump of files stored on one of those “web server” computers.  When someone types your website address into their browser, their computer sends out a request into the Internet.  The first stop is a Domain Name Server which has a list of all of the domain names (www.averyswellidea.com is a domain name) and the actual address of the computer where the website files are stored (67.202.70.14 is its IP address).  Then the request gets bounced all around the world until the correct location of your website files is found.  The files requested are then broken up into little chunks and sent back through the network to their computer where the chunks are reassembled and organized for viewing by the browser.  It sounds complex, but the process happens millions of times a day and is actually very efficient.

With that background in mind, there are three points of investment involved in owning a website.  The first is the purchase of a domain name.  This is usually an annual fee situation where you pay to reserve and use the name you want for your website.  There are many companies that sell domain names, Network Solutions being the most well known.  I use a service called NamesDirect.com because I happened to buy my first domain name from them several years ago.  I’ve been pleased with their service so I’m still a loyal customer.  I did a domain name search and found BoogerBall.com was available.  So, I purchased BoogerBall.com, BoogerBall.net and BoogerBall.org.  Buying the 3 most common names assures me that if I pursue using the Internet to market this product, there will not be a competitor that will use the same name to hinder my marketing activities.  I recommend this strategy to all of my customers as the cost is minimal, but having the name secured can be priceless.

The second point of investment in the process of owning a website is web server hosting.  You need to rent some space on one of the thousands of web server computers out there.  This is usually a monthly fee commitment that varies widely depending upon all of the features you need.  Of course, if you plan to have a big, security intensive website, or if you don’t play nice with others, you will probably want your own server.  BoogerBall.com will probably never need its own server.  I rent space from Steadfast Networks which has proven to be an excellent host and has made it so I can host sites for my customers (all of the sites mentioned above are hosted by my company).

The third point of investment for owning a website is in the actual design and maintenance of the site.  This can be a one-time, flat fee or a perpetual monthly expense.  It all depends upon your level of expertise, the complexity of what you need and what you are willing to pay.  I’m not an expert but I have learned that for my customers, creating a blog website powered by WordPress has been the best balance of cost versus capability versus self maintainability.  I can build it and they can maintain it, both with relative ease and aesthetic excellence.  You will notice that most of the sites listed above are powered by WordPress.  That is how the latest version of averyswellidea.com was developed.  So BoogerBall.com will become a WordPress blog site and that is a story for a future post.  -Amos

Tags: ,

Friday, May 21st, 2010 Product Development Comments Off