Think Say Do - Web Applications, User Experience

Building A Web App From Scratch: Day 1

I’ve been building web applications since 1996. Today, fourteen years later, I’m creating another web app, from the ground up, posting daily step-by-step how it’s done as I work. I’ll be developing a web app to easily handle group t-shirt orders for a screen printing company here in Indianapolis, near Fishers.

In June 2009, The Art Press approached Think Say Do about designing and developing a group t-shirt ordering system. We had worked together closely in the past on many web projects, but this was something bigger and bolder — a project that could revolutionize the screen printing world. Jared Ingold, founder and president, had a grand vision for the web application. It needed to allow people to easily order shirts for an organizational event, while making the process of fulfilling the orders easy for the organization itself.

Enter MyShirtSize.com. In the late summer of 2009, after sketching (with pen and paper) our ideas, we built a prototype using FormStack and called it MyShirtSize.com. We wanted to prove that the idea, even in its basic form, was a viable idea capable of getting a return on the investment. And FormStack allowed us to prototype for $60 a month. Every big idea should begin with a prototype, especially when it’s that affordable.

After nearly a year of monitoring the progress, we found that the idea worked, but needed some tweaking and streamlining to really see it move. So, in late June 2010 we began talking about an official project, a ground-up rewrite, from scratch, using a new cloud-based web application framework developed in-house at Think Say Do.

Last week we nailed down the business goals, the data goals, and the costs. We sat down at El Bodegon in Fishers and wrote out everything in a huge list - every field we thought we should capture, every feature we thought we should have, everything. Then I returned to the office and built a Mind Map of our conversation, and the web app itself.

The mind map was then turned into a text-based outline that I used to create user experience flow charts of the entire app. User experience flow charts are different than functional flow charts. UX flow charts include the feelings of the user, potential ways they might be using the app, and other doodles to add life to the chart. It’s about people’s experience using the app for the first time or the fiftieth time. Functional charts include things like database actions, Yes/No actions, etc… nice for programmers, but not great for getting a vision for the entire experience.

From there, I started sketching user interfaces with my Prismacolor art markers and my large paper tablet. It smells a little funny, but the results are priceless. I find that drawing on paper, away from my computer, helps me think of new approaches to interface design problems. As you see the app progress in the days ahead, I’ll point out some of the ideas that started as sketches in this stage.

I took the sketches and hung them around my office on the walls and bookcases using Alvin Professional Drafting Dots (amazing tool for hanging temporary sketches). These will become my design inspiration and master guide as I begin developing the API (application programming interface) tomorrow, along with the UI (user interface) framework.

More to come tomorrow afternoon…

Website for Ingold Sound Systems, LLC

A few months ago Ernie Ingold, founder and expert sound engineer at Ingold Sound Systems in Shelby, Ohio, contacted me for assistance with designing and developing a new website. Late last week, after a month of working on the project, we launched the new site.

Check Out IngoldSoundSystems.com

One of the things I am passionate about is accessibility. All of my sites allow a visitor to turn off style sheets to view and navigate the site without images or styling. And because search engines such as Google also like sites without images and style, we’ve found that it helps a lot with SEO (and thereby sales leads).

This site is also built on top of a nice little in-house PHP framework (or toolkit), so it’s easy to manage and flexible to add new features down the road.

Tracking SEO Conversions by Phone (via @mktgtechblog)

Business Plan 2010: Part 2

This evening I will be attending the Rainmakers Techmakers session at Scotty’s downtown Indianapolis.

As part of Think Say Do’s ongoing business focusing plan for 2010, I will be out at more networking events talking with people to see how we can help. We’ve also launched a new introduction page about Think Say Do. We’ll be launching a new, more robust site once the dust settles for the business plan.

I just finished reading The Most Successful Small Business In The World by Michael Gerber. That’s what I’m shooting for this year! To set the platform to become The Most Successful Small Business In The World. :)

Have a great day!

~ Collin Schneider

Business Plan 2010: Part 1

Ok, so last week on Twitter I mentioned that I would be talking about Think Say Do’s new business plan. Here is the first quick service overview and how it can benefit your business or organization:

Web Application Strategy & Management

Web applications are web sites that help you run something in your business more efficiently. For example, The Art Press in Indianapolis uses an iPhone web application to estimate their screen printing costs during a sales visit with a prospect. The web application enables people to know an exact cost amount within seconds - no waiting for a quote, no form filling… just a conversation and an immediate quote. That’s the power and efficiency of a web application for your business. And there are hundreds more stories just like that.

Think Say Do offers Web Application Strategy & Management services to help you find uses for web applications within your business. Call me today at 317-489-9184! I’d be happy to talk with you.

~Collin Schneider, Founder / Systems Designer

The Secret to A Maintainable, Growing Site!

Everyone wants a successful web site or web project. Success can of course be defined in so many ways. It is subjective at times. But, there are certainly objective measures of success too.

One aspect of a successful project is maintainability. Maintainability is the ability to update and grow a project long after it completes. It’s the hundreds of changes made after a site goes live. It’s the years of service a solid site gives it’s patron. Businesses benefit greatly from the low cost of ownership of a maintainable site. Web sites and applications continue to live, breath, and evolve long after a project finishes. As an example, I still make regular updates to a major site I wrote over seven years ago. In fact, I just spoke with the IT director today about adding some major new functionality… to seven year old code!

Over the years, I have tried many methods for writing web applications. From old “spaghetti” code (a mess to maintain over the long-run), to basic OOP, to MVC (like Ruby on Rails), to event-driven programming (like Visual Basic). In fact, I enjoy researching and reading about different programming methodologies. But, at the end of the day it is about being able to maintain and grow a site for years to come.

Maintainability is especially important for small, one-man shops and small non-profits and businesses. Here is the secret to great maintainability: a short development stack.

What do I mean by that? Years ago, growing up in a town village of about 150 people in rural Illinois, we used to go to the local bar/coffee house. I remember as a kid being asked if I wanted a short-stack or a tall-stack of pancakes. Of course, the tall stack looked tempting with all those layers of syrup, but ultimately the small stack proved to be the best option for a growing boy.

The same applies to you if you are a small business, non-profit, or one-man shop. You want the shortest stack possible on your web site. By that I mean, you want the fewest layers of code you can have that makes sense. Each layer of code adds more complexity and distances the developer from what is really going on.

For example, on most web sites you have these layers:

1. Web Browser (Safari, Firefox, Chrome, Internet Explorer, etc.)
2. HTML/CSS
3. HTML/CSS Framework (Custom, Blueprint, etc.)
4. Javascript
5. Javascript Library (jQuery, RightJS, Mootools, etc.)
6. Web Server (Apache, IIS)
7. Programming Environment (PHP, Java, Ruby, ColdFusion, etc.)
8. Programming Libraries
9. Web Application Framework (Zend, Ruby on Rails, WordPress, etc.)
10. Web Application (WordPress, Expression Engine, etc.)
11. Custom Code

See that tall stack? And it can be far taller too! So, when you are evaluating options, look at the complexity and depth of your stack … the shorter the better usually. You can more readily track down bugs, add new features, and adapt to changes. It allows you to work like the Internet with agility, moving at the speed of modern business. And, it keeps your sanity. Maintainability is key to a successful long-term project.

~Collin Schneider
Founder / Systems Designer
Think Say Do, LLC
P: 317-489-9184

The 2010 Plan

Things have been so busy the past few months with year-end projects. Here’s what I’ve been up to, and what to expect in 2010…

• Online Donation System training in Fort Myers, Florida, with an inspiring non-profit, New Mission Systems International
• Machinery inventory system updates for Peterson Machinery in Casa Grande, Arizona
• Automatic SEO page generation system for The Art Press in Fishers, Indiana
• Gift Planning mini-site for Hephzibah Ministries in Macon, Georgia
• FormSpring integration for MyShirtSize.com, a service of The Art Press
• Online School Application System database testing for Associated Training Services through e-Media Resources in Sun Prairie, Wisconsin
• Policyholder Payment System for Illinois Casualty Company in Rock Island, Illinois
• Site migrations from one server to another for e-Media Resources
• Finished phase one of our top-secret internal project, which included writing a custom language parser and interpreter, writing a yet another database abstraction library, and a completely new web application framework

What’s Coming in 2010?

• Digital conversion of printed materials to PDF & Word for a non-profit client - includes editorial services as well
• Several major non-profit site redesigns, including nine mini-sites
• Several small business site redesigns, including writing a custom CMS
• Developing the streaming video infrastructure for StreamPilot.tv, an e-Media Resources project - 2010 is the year this project gains traction!
• Lots more exciting projects! I’ll be posting details as they become available, and I’ll try to get some videos out here soon too to show some of our incredible design and programming work.
• Finally, our top-secret project will be launching in 2010 as a SaaS application. I am so excited about this project, three years in the making, with many delays. Hundreds of hours of research, coding, scribbling notes, talking with people, thinking. As with anything, there’s risk for me to be putting so much time and energy into this. But, I’m hopeful that it’ll pay off and small businesses (my passion) will find it a valuable tool. A redesigned ThinkSayDo.com will be launched shortly after the project launches too. More on this project by Q2 of 2010.

If you have a project you would like to discuss, let me know! I would be happy to talk with you, even if it’s only to provide some technical insight. Lunch is on me! Call me right now… if you don’t reach me, I’ll call you back asap: 317-489-9184

~Collin Schneider
Founder / Systems Designer
Think Say Do, LLC
Business Systems Designed for People.

Apples & Chicken

I just returned from the Apple Store. As always, a great experience. Why don’t more businesses follow this model? The store was jammed with paying customers. I was greeted by two Apple staff… greeted with a smile, a handshake, a name, and an eagerness to serve. As a business customer, that impresses me. I rarely get that treatment even from other small businesses that could afford to do the same easily.

After the Apple Store, I joined my brother, a team leader at American Funds, for lunch at Chick-Fil-A. As always, yet another great experience. Why don’t more businesses follow this model? The store was jammed with paying customers. I was greeted by two Chick-Fil-A staff… greeted with a smile, a welcome, and an attitude to serve. As a business customer, that impresses me.

Are you catching my repetition? What do these two companies have in common? Why do I feel great paying them to serve me? I think it comes down to this: from the top of the business, they’ve focused on creating a great experience. And that great experience starts with the employees. If employees love the company they work for, they’re eager to share that love with customers, plain and simple. No gimmicks. No marketing push. No sales training. If your employees and partners love what you do, they’ll tell others.

I would love the chance to talk with you about how Think Say Do can help you this coming year! We’ve got great ideas, great partners, and an eagerness to serve. Call me, Collin Schneider, owner, at 317-489-9184 right now. I’ll answer, or call you back shortly, with a smile :)

Web Based Database Builder for Research Studies

Over the past several months, Think Say Do has been working with online marketing company e-Media Resources to deliver a visual query builder for Chamberlain Research Consultants in Madison, Wisconsin. It has been very well received with thousands of sign-ups since launch.

To start the project, we wrote the front-end for participants to sign up for research studies, completely integrated into Chamberlain’s branding standards:

The participant sign-up forms are dynamically built from a custom metadata file describing how the form fields should behave. This metadata file also then was leveraged dynamically for the visual query builder to provide incredible depth of searching. If that sounds technical, read on it gets easier to understand…

In the Visual Query Builder, you can add as many filters as you’d like. You can drill through hundreds of fields, each with options tailored to that particular data type. So, for example:

• Give me all people in WI
• Who own a Wii
• And Guitar Hero
• And have children between the ages of 6 and 12
• With a household income over $45,000
• Who own energy efficient appliances

That’s a relatively complex query, spanning in this case three participant databases. The amazing thing is that Chamberlain staff had to write no SQL to get a participant list almost instantly. All they had to do was select a few drop-downs and the SQL was written for them with no technical knowledge required.

Each field type was populated from the metadata file and directly linked against the data. You can even save your queries for future use, tap multiple participant study panels, and cross-search panels, plus download Excel lists of results and full database lists. Amazingly awesome. Amazingly powerful. Amazingly easy to use! Training lasted just 20 minutes to cover the entire process! That’s how easy it is to use.

If you’re interested in having something like this for your research consultancy, let us know. We’d be happy to help! Call us at 317-489-9184 (Indianapolis area) or email us at projects at think say do dot com.

~Collin Schneider
Founder / Systems Designer
Think Say Do, LLC 
Business Systems Designed for People.