Creating a site for the Fort Worth Star-Telegram

January 1, 2017

Designing user interfaces is my passion. Especially interfaces that make a positive change in the lives of those that use the design. And that is one of the reasons why I was excited to team up with The Rainwater Charitable Foundation and the Fort Worth Star-Telegram to create a site that would provide “a new scholarship program created to provide Tarrant County students who have overcome adversity with resources and experience to continue to excel in college and beyond.”

Where it all started

Six months ago a friend of mine suggested I place a bid for a web design job for the Star-Telegram in Fort-Worth. She suggested this because she personally knew the decision-maker of the new job, and we had previously worked well together on a few web design projects.

I did. A series of introductory emails where pleasantries were exchanged, proposals and resumes provided, then a question was asked that I didn’t expect from a large, corporate client: “Would it be possible for you to provide me with a name and contact information for a reference that I could reach out to?” I thought, this is awesome, as a previous client will sell me to them far better than I could ever sell myself. I quickly reached out to a long time client and asked if it would be okay that I share their information to be contacted. And boy were they thrilled with the opportunity to help.

A previous client will sell me to them far better than I could ever sell myself.

After a week of waiting I found out that I won the bid, but what was more surprising was that the Fort Worth Star-Telegram said I won the bid because of the testimonial. Not because my bid was less than the competitors, or my proposal was more comprehensive, but because of the testimonial. They said, “Your client couldn’t stop gushing about you.”

That meant the world to me.

Using the presentation style of Aaron Draplin

Though I won the bid, I still needed to present my ideas. It was, and always is, imperative that everyone knows the goals, and how we plan to accomplish them.

I think the worst part about a web design project is when those involved are confused, or have different goals in mind. To prevent any misunderstanding I needed to make sure that I laid everything on the table in our first meeting.

There are a couple ways of doing this, but PowerPoint is the most common and easily created. With that said, a PowerPoint can become very boring, but I’ve seen a few presentations by Aaron Draplin where his slide style kept me engaged. Bright colors, bold text, and plenty of white space on each slide. So, to keep it interesting, I took this style and made it my own. You can view the entire presentation at the following URL: http://micahryan.com/presentation/dreambigfortworth/web-design-process

I think the worst part about a web design project is when those involved are confused, or have different goals in mind.

They loved the presentation, and it opened them up to questions that let everyone better understand our goals.

I think the worst part about a web design project is when those involved are confused, or have different goals in mind.

Creating a mockup before leaving the office

With the excitement in our sails I wanted to keep the momentum going. The best thought I had was to create a mockup before leaving their office.

I knew that this would knock their socks off, and also keep the dialogue going about content and design, but I needed to be quick. I only had an hour before I would need to leave the office. I buckled down, created a mood board of inspirational sites on Pinterest, and began designing.

Typically, I lean toward a very clean layout, without any distractions. However, with this site having a demographic ranging many ages I decided to use a lot of the graphical assets that had been already used in print material which would be fun for the young, and maintained the white space and sectional layout design for easy information dissemination for older users.

They were so excited to see how quickly our first meeting had materialized into something they could see that they were on board with the first iteration.

Using Trello as a project management tool

Now that we were on the same page, we had to maintain the communication, and the best tool that I have been using to manage projects has been Trello. It has worked well for me because of the UX, and how easy it has been for users who aren’t familiar with the tool so that they can quickly grasp the basics.

If you don’t know, Trello is a task management app that gives you a visual overview of what is being worked on and who is working on it. It used the Kanban system, which was developed in Toyota as a system to keep production levels high and maintain flexibility. It is best represented as a whiteboard filled with post-it notes. Each post-it represents different tasks involved in the project. With this type of visual project management tool it has been a cinch to onboard clients to use the tool, and use it well.

Our setup included lists for Notes, To Do, Doing, and Done. And under these lists we included items that were relevant for each like “Example Sites” under our Notes list. This type of structure allowed for all involved to see the progress of the project, add relevant documents or information where needed, and ask any questions.

Using Webflow for an easy hand-off

Webflow is becoming a formidable tool in my toolbox, and has made CMS hand-offs extremely easily. That fact alone is why I decided to persuade my client to use Webflow instead of WordPress. Being able to edit the content on the live website using the Editor is so intuitive that I have been able to hand-off sites with less documentation on how to update the content.

The setup for hand-off was fairly straightforward. After I created the site in Webflow I edited the settings to include the following: website icons, hosting that would automatically bill the client through Webflow, multiple custom domains (eight in total), and the ability for collaborators to edit the site.

Very little support needed

Now, that The Rainwater Charitable Foundation has control of the website, and their team is completing all additional updates, they have needed for little support. They have been able to quickly complete updates, and really utilize their website to their liking.

Handing-off websites that the client is completely satisfied are what make my job enjoyable.