Erik Trautman logo crest shield seal

Erik Trautman

“Everything you can imagine is real.”
-- Pablo Picasso

It's All About the Little Things

I've spent the past week or so more or less getting back into a coding routine. I've finally managed to bite off a good chunk of my blog project and I feel like I am hitting my stride with PHP and SQL after scratching my head and dealing with stupid errors for a frustrating couple of days. It feels really good to have momentum building again after all the moving and traveling.

The blog project (to produce the production version of this blog) comes both from a desire to have full creative control of my website and as a way to practice building a web application from the ground up. It's a front-to-back journey through creating something from nothing and it has been incredibly useful as a learning tool.

In order to really milk the experience for all the learning I can get, I am doing as much of it from scratch as possible. Often that is a license to take a few hours aside and learn a new skill or function because it came up in a YouTube video I was referencing or was mentioned in a Stack Overflow help article. Yesterday, though, that meant I spent the entire day working only on the code for pagination.

To anyone who is unfamiliar, pagination is the division of a website into discrete sections or pages. In articles, that is the annoying page break where you have to click to page 2. In blogs, it is that section at the bottom where you can click previous, page 1, page 2, page 43, next page, etc"¦ In my case, the formatting is fairly straightforward because it's just a tiny little section. Foundation provides some pretty numbers and arrows anyway. The issue is really where the display meets the logic, which is more complicated than it first seems.

Pagination:

If your site has only enough posts for 3 pages, it is pretty straightforward. But even that requires a lot of moving parts behind the scenes: Highlight the current page, make the next / previous buttons unavailable as appropriate, deactivate hyperlinks on unused navigation items"¦ Then think about a case with 30 pages and you've chosen some random page in the middle, like #14. You now have to think of all those things but also worry about putting in ellipses that hide the unimportant chunks of pages while still showing enough of the early and late pages for a useful navigation experience. The logic starts to get more interesting.

The experience hasn't been particularly revolutionary; it's mostly just a time-consuming process of plug-and-chugging through the logic, putting out a bunch of bloated code and then trimming away all the redundancies and newbie mistakes. What it's really done is to again make me shake my head in appreciation of how much detail there is in all of the things unknown people have created on the web and in the real world.

On the web, every element of the buttons, links, design flourishes, page layouts, typography, and gentle gradients had to be thought through in detail and coded with the appropriate logic. The best design is often nearly invisible. Similarly, when you zoom in to a good product in the real world, it can be astonishing to think of how much meticulous thought went into details that only peripherally impact our user experience but are still an essential part of either the feel or use of the product.

Apple's hardware is an overplayed example of the importance of meticulous design (and it is warranted). OXO makes some fantastic items for the kitchen that also show great design (like the measuring cup with the diagonal fill lines inside so you can see the levels from above. Those, however, are obvious cases. Some of the more interesting things are those overlooked or unexpected items in our lives like pen clips or zippers or faucet handles, each of which requires a surprising level of thought and detail to function smoothly.

I was, frankly, a bit baffled when I heard that Steve Jobs had a passion for typography. It seemed at the same time oddly esoteric and wholly pedestrian. But the more exposure I've had to the elements of web design, the more I've come to believe that typography is the most overlooked product of design in our entire lives. We blithely read thousands to millions of words a year without fully appreciating the level of detail that goes into making that text as legible as possible while simultaneously conveying the appropriate emotional content. Think of how much consideration is required to model the curves, spacing, and sizing (among other things) of a single letter. For the uninitiated, a quick overview of typography can be found here.

The point is that are creative people across the world imagining the interfaces and billboards and car doors and pen caps and ice scrapers and lampshades into existence. Every detail in every product was created from nothing and has some reason for being there. Diving into those details often tells some surprising stories and can help to understand many of the things we use every day that just "look right" or "seem to work".

It also highlights a major difference between being a "creator" and a "consumer". The distance between the two is comprised not just of the will to produce but an understanding of all those oft-overlooked elements and the hard work that must go into any product of effective design. It is also why, though the devil may be in the details, there is beauty there and that is why it is so rewarding to be a creator.