Celebrating 10 Years in Business

September 16, 2011 By 2 Comments

Tomorrow will be the 10th anniversary of michaelwender.com. I started this business in my old bedroom at my parents house, and through the years it has grown into an enterprise servicing over seventy clients all across the United States and Canada. I never dreamed I’d spend my career working from my own home, but along the way I’ve discovered that freelancing is truly my “dream job”. Funny thing is, ten years ago my career as a freelancer was almost over before it started…

“Do I really want to do this?”

Ten years ago my career aspirations were suffering from a serious lack of motivation. In June of 2001, I was laid off from my job as a web designer/graphic artist for QuVIS1 Semiconductor (Quality Visual Image Systems) in Oak Ridge. During the previous year, I’d taken over their entire online branding. However, being primarily an engineering/technical company, their management under utilized my creative services. I got burned out because my skills and talents didn’t amount to much in the overall scheme of the company. I was an expansive, round peg trying to fit in a small square hole.

I was so disenchanted with web design and graphic arts that I considered a career change. I had an offer to be a youth minister at a church in Orlando, Florida, and I was also having a blast working with youth at a church in Knoxville. Working with people has always been something I enjoy and do well and perhaps the ministry was where I should be. However, as I was considering my options, I also made plans to start my own freelance consultancy.

Tennessee’s “Silicon Gulch” Provides a Steady Stream of Clients

California may have “Silicon Valley”; however, Oak Ridge National Labs along with many other tech startups, make East Tennessee another hotbed of high technology jobs and opportunities. My brother, an electrical engineer and VP of Marketing for a micro-chip company, calls our region the “Silicon Gulch”.

Working for a year in the Oak Ridge tech sector provided me with a wealth of contacts. Tech savvy firms are always in need of graphic designers and web developers who can translate their jargon and concepts into marketing materials. Graphic designers who excel in this environment must have a rare combination of an artist’s heart and an engineer’s mind. This fits me to a “t” as I love to create while paying close attention to details and specifications. The day I was laid off, I received two offers for freelance work from our office mates at ASIC International.

My First Gig – Should I take it?

That summer I dabbled with a couple of freelance projects, but it wasn’t until Monday, September 17, 2001 that I took my first real, paying gig. It was a small software firm who’d heard about me through my brother and my work in Oak Ridge. They needed help with their logo, website and overall branding.

Prior to our meeting I was having doubts as to whether or not I should go. I was afraid I’d take the job and then discover I lacked the motivation to finish. But, thanks to my mother speaking frankly with me (yes, I owe a lot to my mother…and father too for that matter), I decided to go and see what would happen. I could always do this one project and move on to something else if I didn’t enjoy the work.

As it turns out, that first meeting renewed my love for what I do. I was called in as the expert, and my client allowed me to advise, consult and direct using my expertise. No longer burdened by a QuVIS middle-management that didn’t know what to do with me, now I was free to manage the project and help my client achieve their goals.

Working from Home for Ten Years

My biggest fear as I began my freelance career was that my skill-set would stagnate since I wasn’t working in close contact with others in my field. However, I soon found out that wasn’t the case. In fact, given my field, freelancing has helped to broaden my skill-set as I often must find solutions on my own without relying on an office-mate who has the answer.

This has been just one of the many perks and surprises I’ve gleaned from working from the “home office” through the years. Others include:

  • Clients from all over – My primary means of gaining new clients has been via word-of-mouth referrals. However, I’ve gotten quite a few via my online footprint. I’ve gained one client from New Mexico simply because he liked my personal website. Many other clients have found me through various tutorials and screencasts I’ve published through the years. I currently work with clients in Georgia, North Carolina, New York, New Mexico and California.
  • Serving as an “expert witness” – A couple of years back I was hired to serve as an “expert witness”, testifying about the semi-permanence and residual effects of person’s online activities.
  • Discovering my “dream job” – The saying goes, “Find a job you love, and you’ll never work another day for the rest of your life.” When I graduated from Full Sail University in 1999, my plan to was to get a “dream job” working in special effects or digital animation in Southern California. But, as I followed my passions, I ended up working as a freelancer. Now, ten years into it, I must say it is my “dream job”. I love being able to use my expertise to help others accomplish their goals online.
  • Being my own boss – There are more perks to this than just setting my own schedule. For example, when I’m racing to finish a project for a client, I love the fact that I don’t have to get approval from management if I determine purchasing some new software will help me to get the job done quicker.

The other day I was commenting how I don’t believe I have many (if any) friends who have been working the same job for the past ten years. I’ve found that becoming your own boss solves this problem. However, much as I’ve been working the “same” job for ten years, the technology I use to build websites has changed tremendously during that time. I’ve supplemented my skill-set by learning new programming languages, softwares, techniques and operating systems. Through it all, the one thing that has stayed the same is how much I enjoy helping my clients succeed online. The satisfaction I gain from this is what keeps me doing what I do. So, to all my clients, friends and family who have helped make me what I am today: Thank you! Here’s to the next ten years and beyond!

1QuVIS was a pioneer in digital cinema. Headquartered in Topeka, Kansas, they primarily worked with the film industry and were involved in several historic digital cinema “firsts” (e.g. first digital theatrical release, The Last Broadcast, 1998, Cannes Film Festival, Source: Wikipedia: Digital Cinema – Claims to significant events).

2QuVIS’ Oak Ridge offices were home to QuVIS Semiconductor. Our staff consisted of my brother, Reid Wender, James Miller and myself. We were working on using QuVIS’ technology to make high-quality Internet streaming video a reality.

Filed Under: General, Portfolio

An In-Depth Introduction to my First Commercial WordPress Theme

July 26, 2011 By Leave a Comment

Two Mondays ago I put my first commercial WordPress theme, Pictography, on sale to the public. Preparing that theme for release has consumed much of the mental capital and time I use for blogging here. So, today I’m going to give an in-depth introduction to the theme, and later this week, I’m going to fill you in on the dynamics of the WordPress commercial theme market and why I choose to become a part of it.

Introducing Pictography

First and foremost, I designed Pictography as a theme that does a great job displaying your photos. The most prominent feature of the theme is its home page image carousel which lets visitors view any and all featured images from your site’s posts. This feature tips its hat to a Picture of the Day (POD) Flash app that I ran on this site in the early 2000′s. That app would load displaying my site’s latest photo. Below the photo, Next, Previous, Today and Random buttons would allow users to browse all the images I’d uploaded.

My Picture of the Day Flash App was the inspiration for Pictography's Image Carousel

It was a popular feature with both friends and random visitors. The app kept stats for individual users, and I found that the average user viewed 15 or more photos during any one session. It served as a great calling card for my skill as a designer and developer. (In fact, I even gained one long-time client a half a continent away in New Mexico just from that person’s random appreciation of my site’s design while surfing the web.)

However, despite the popularity of POD, after seven years, I grew tired of it. For one thing, in 2007 I moved to using WordPress almost exclusively as my CMS for all personal and client projects. As I’d developed POD long before WordPress, it wasn’t integrated with the WordPress backend. Therefore, as I dabbled with several different re-designs of this site, I ditched POD while keeping the idea in mind that someday I’d build a similar app again using WordPress for managing the photos and technologies other than Flash for the front-end.

Re-imagining Picture of the Day

Last fall, I finally started adjusting my schedule to pursue my goal of releasing a commercial theme. This had been on my mind for a couple of years, and as I got started I knew that I wanted my first theme to prominently feature a redesigned Picture of the Day style app. This app would work on desktops and mobile devices, and in order to work efficiently, it would query images from the database using native WordPress functions.

Using jQuery to Query Featured Images
To achieve these goals, I began coding the front-end using jQuery. Then for my AJAX calls, I added code to my theme’s functions.php so that WordPress could receive my query requests directly. This meant my AJAX calls could reference the theme’s main URL (e.g. http://example.com?action=getimage) rather than referencing some additional PHP file setup to specifically handle AJAX requests (for more info on this, check out this post by Will Norris).

Only Query Posts with Featured Images
Now that I had the front-end and back-end talking, I coded an image retrieval function which returns a previous, next or random “featured image” image from your posts if given a post ID and an action parameter. I learned a lot as I built this function. For example, WordPress stores featured images by adding a post_meta field called _thumbnail_id to the post. I combined that knowledge with the get_{$action}_post_join and get_{$action}_post_action filters to modify get_posts() to only retrieve posts with featured images. This meant my image retrieval function would always serve up images while ignoring posts without featured images (e.g. text-only posts).

A Flexible Solution
In the end, this new image display was much more flexible than my previous Flash-based Picture of the Day. This proved true late in the development process when user testing revealed that the Previous and Next buttons were confusing users whenever the display was on the first or last image in the series of posts.

Originally, I coded those buttons to “grey-out” if a user clicked them while viewing the first or the last image. This was to indicate that they’d reached the “end of the line”. However, I found that users were confused by this behavior, so I added code to my WordPress image retrieval function to loop back around to the first and last images published. What made this easy was the fact that I’d coded the front-end to simply receive the data returned and display the image. Once I’d updated the backend function to loop, the front-end display worked automatically.

Adding Featured Images with WordPress for iOS

Just about the time I was ready to release my theme, I discovered one major snag. All along, one of my goals with this theme was to use it with WordPress for iOS and WordPress for Android. The plan was for mobile users to create their post, assign a “featured image” and publish directly from their device. However, due to a limitation with WordPress’ server-side XML-RPC, neither of these apps is able to add a featured image to a post. Basically, until WordPress is patched on the server-side, the needed “hook” for WordPress mobile apps simply isn’t there for adding a feature image.

So, I coded a couple of functions which hook into WordPress filters which run immediately before and after a post is published. The first function finds the first image inserted at the top of a mobile post, removes the images’s HTML from the post and returns the post ID for that attachment. The second function adds the returned post ID as the _thumbnail_id for the newly created post.

Design Decisions and Simple Settings

In addition to the image carousel and the featured images for mobile posts, I packed several other features into the theme:

  • Dynamic Widths for Home Page Widgets – widgets added to the horizontal widget area below the image carousel adjust their widths based on the number of widgets present. One widget spans the width of the area, two widgets split the area with the first spanning 2/3rds of the space and the second spanning 1/3, and three widgets share the area equally. This process repeats for newlines.
  • User Customizable Color Palettes – the theme ships with eight color palettes along with a jQuery powered color picker which lets users create their own.
  • Custom header logo and favicon – I took advantage of the WordPress custom header API to allow users to upload their own site logo. In addition, they also have the option to upload their own favicon.

Despite the many features of the theme, my goal has been to keep in very user friendly. The theme settings page only has five settings, and the features I’ve mentioned above simply work without making the user think about how they work or how to use them.

The Pictography settings page.

In the end, with the release of version 1.0, I am pleased that Pictography is easy to setup and use. Rather than trying to be all things, it is a refined photobloging tool suited for displaying your photos front and center. Time will tell how well it will do as a commercial product, but I know I’ll enjoy using it.

Filed Under: Portfolio Tagged With: ,

Pictography WordPress Photoblog Theme – Color Palette Options

July 19, 2011 By Leave a Comment

For those of you who follow me on Twitter or Facebook, you may have noticed that I released my first commercial theme last week (hope I didn’t annoy any of you). In case you didn’t notice, it’s called Pictography, and it’s a WordPress Photoblog Theme.

Since I’ve created Pictography for public release, one feature I’ve found necessary for it to have is the ability for users to customize its appearance. To that end, I’ve added multiple color palette options on the backend which allow users to set the theme’s colors to suit their style. Watch the video above to see how it works.

In addition to color palette options, the theme also comes with two different layout styles. Plus, users can upload their own logo and favicon. For an example of what you can do with the custom logo and favicon options, check out my new Daily Photos blog.

Filed Under: Portfolio Tagged With:

Recent Work: Aldis Distributor’s Map

June 20, 2011 By Leave a Comment

Ever since returning from a vacation a couple of weeks ago, I’ve had little time to blog. During that time, I’ve been crunching on a couple of time-consuming projects. One of those is the new Aldis Distributor’s Map. Here are the highlights:

Project Specifications
My client needed a web page featuring a world map and contact information for their various regional distributors. Starting with a clickable graphic of the six major world continents, we added a “tab” system underneath. Each tab represents one of the continents, and inside each tab are tables listing various regions covered by Aldis distributors.

In addition to the above, my client wanted to be able to add/edit/remove data for each of the tabs.

Implementation
I created the map using HTML, CSS and JavaScript (i.e. jQuery Tools Tabs). Sticking with those technologies means that it will work across all modern web browsers and mobile devices.

For the backend, I used WordPress Pages for the tab content. In addition, I used the WordPress Boilerplate plugin to allow for easy management of repetitive data used throughout the tabs (e.g. one company featured in several regions can be added as a “boilerplate” shortcode which can be added to multiple places while allowing editing in only one place).

Conclusion
The previous iteration of the Aldis Distributor’s Map was an Adobe Flash based app. My client couldn’t edit it, and it didn’t play on iOS devices. This new version is completely editable by my client, and “plays everywhere.” Now, rather than coming to me for updates, they are able to do those themselves. Given their rapidly growing distributor base, this is an ideal solution as they can quickly update their website to reflect their new alliances.

Filed Under: Portfolio Tagged With: ,

Recent Work: Brochure, Google Checkout, Spam Submission Prevention

April 8, 2011 By Leave a Comment

This week I’ve been at work designing a tri-fold brochure, coding a Google Checkout shopping cart and adding a spam prevention field to a form. Here’s a breakdown of those projects:

  • Love Worth Fighting For Attendee Brochure – In preparation for next week’s Love Worth Fighting For (LWFF) marriage event in Abilene, Amarillo and Pampa, Texas, I’ve designed a tri-fold brochure that all attendees will receive. In addition to next weekend, LWFF is confirmed for at least thirteen more cities throughout the year. That means my work will be in the hands of 25,000+ people. See some preview comps of the brochure below.
  • KnoxvilleForce.com Google Checkout Shopping Cart – This week I’ve implemented a Google Checkout integrated store on the Knoxville Force website. Once my client gets their merchandise added, we’ll be switching on the store either today or early next week. Of note in this integration is my use of WordPress custom post_types for the products that appear on the store pages. This means my client will be able to easily add and edit products appearing in his store.
  • AldisCorp.com Contact Form – Spam Submission Prevention with reCAPTCHA – reCAPTCHA is a Google service that allows developers like myself to easily add a CAPTCHA (i.e. “Completely Automated Public Turing test to tell Computers and Humans Apart”) field to a web form. In the case of the contact form over at the aldiscorp.com website, they were frequently receiving spam or web-bot submissions. Adding the reCAPTCHA field means no more automated submissions on that form which means no more human administrative time spent by Aldis employees filtering out spam submissions.
Filed Under: Portfolio Tagged With: , , , ,

Recent Work: Jana Spicka’s Women Getting Real Website

April 1, 2011 By Leave a Comment

In starting the title for this post with “Recent Work”, I use the term “recent” loosely. That’s because in today’s feature of what I’ve been working on, author and speaker Jana Spicka’s Women Getting Real website first went live nearly two years ago. Then we went live last summer with the redesign featured in this post. However, given the amount of work that Jana, her team and I put into the website, I’m certainly glad to share it with you today.

This time last year, Jana met with me to discuss what was and what wasn’t working with her website. She had a list of things she needed changed: the overall look-and-feel, the site navigation, the layout of page, the shopping cart and various other details.

That list began a several month redesign process where we worked back and forth on the design until we captured the vision that Jana had in mind. To do this, I started with the WordPress Mystique Theme as a base. It’s a free theme, available on the WordPress.org Theme Repository with a lot of features you might normally pay for.

We modified the theme’s header, its background, the main menu colors and the colors of the page elements. Then we added in features to make her site stand out:

  • Featured Home Page Slides – I programmed a backend interface for adding “featured slides” on the home page. This let’s Jana’s web team highlight specific content on the site.
  • Popup “Post-It Note” – First time visitors to the site are served a popup “Post-It Note” which the web team uses to share extra-important announcements.
  • Separate Header for the Blog – We added a separate header for the blog to give a more “personal” feel to accompany the topics Jana covers there.
  • Custom Online Store Layout – We used the Shopp Plugin for Jana’s online store, and I modified its layout to match the look-and-feel of the site.

You can visit the site at womengettingreal.com, or check out screenshots below:

Filed Under: Portfolio

Recent Work: A Website with Twitter Integration and Mobile Browser Optimization

March 25, 2011 By Leave a Comment

Later today marks the debut of Hope424.com. It’s a website produced by Sevier Heights Baptist Church for promoting their April 24, 2011 Easter Service.

Starting with a Photoshop comp from their communications department, it was my job to build a custom WordPress theme which matched their visual spec and delivered the desired functionality. In the end, I ended up building and developing the following assets:

  • Custom WordPress Theme – Starting from scratch, I built a theme to handle the Hope424 one-page layout. This includes functionality for:
    • Custom “Tweet” post_type – I used the WordPress post_type API to add a “Tweet” post_type which we use to store Twitter tweets.
    • [hashtag_tweets] shortcode – This shortcode pulls in tweets from Twitter using a specified #hashtag. It stores the tweets as a “tweet” custom post_type with a status of “Pending”.
    • “Tweets” Archive – Visitors to the site can view archived tweets in a paginated view. In addition, logged in site admins can view the same page and moderate the publication status of each tweet (i.e. “pending”, “publish” or “trash”).
  • Custom WordPress Mobile Theme – I configured the site so that it serves up a mobile-optimized theme to mobile web browsers. In addition, with the help of jQTouch and the WordPress Mobile Edition Plugin, I was able to get this feature built in under two days.

See screenshots of my work:

Filed Under: Portfolio Tagged With: , , , , ,

Recent Work: Aldis Website Redesign

March 18, 2011 By Leave a Comment

During the past week, I’ve been putting in long hours as I make final edits to the Aldis Corporation website redesign. I’m actually working on the site this morning in order to prepare it for an internal review. So, rather than going into many details, here are some preview screenshots (click on the thumbnails to see a larger version):

Filed Under: Portfolio Tagged With: , ,

Recent Work – New York Metro ISSA Website

March 11, 2011 By Leave a Comment

On Monday of this week, I went live with a redesign of the website of the New York Metro Chapter of the ISSA (NYMISSA). Below is a screenshot followed by a brief review of the design process:

[Read more...]

Filed Under: Portfolio Tagged With: , ,
« Older Posts