Little Tiny Fish

Redesigning the new OnMilwaukee.com may have been among the biggest undertakings I’ve had to embark upon since starting at the media company, but the whole thing started on a whim. I had a little free time and I took a look at a couple of small elements. But the more I pushed the data around, the more I realized we could probably be presenting our information a lot more clearly.

I scrapped the small ideas and started looking at the bigger picture. This was the result.

There are quite a few differences between the old site and the new site. You may instantly see (to the left) that the new site feels much more open and inviting. I wanted to make sure there was a lot more breathing room on the new site. There is significantly less text on the new design but it’s only about 12% shorter. This is because the information that is left in tact has a lot more space to exist.

On top of the extra space I worked to unify the design elements. The red banners help separate the sections. The widgets all have a unified background color. Instead of having three or four different forms of widget navigation I cut it down to one. I also developed a grid pattern to help decide how large certain elements should be and how much space should be allotted between them.

The biggest change, as far as usability goes, is the presentation of information. We discarded the formality of having sections on the home page. Articles are still organized, structurally, within sections that you can access from the navigation bar, but on the front page those sections matter less. What matters more is the newness of information. Initially the redesign asked for a Twitter-style list of new stories, but other staff members wanted a more curated feel. They didn’t want quick blogs to have the same importance as the better composed stories. So we moved the new article list to the top and added a more magazine-like, curated section on the main page. This allows users to a) easily see which articles are new and b) easily see which articles are most important.

The business listing widget was simplified, while the event calendar was given more presence. Our Weekend Preview, an important weekly article, also finds prominence on the front page. In the old design it had a tendency to disappear quiet quickly. Now there is a permanent link right on the homepage.

The logo was updated to move away from the passe Web 2.0 look to the softer gradients that are more pervasive in design today.

Listed here are only the major considerations for the entire redesign. There were countless other smaller calls that added up to one big idea.

You can see full-sized images of the old site and compare it with what the new site has to offer.

Today I had a relatively easy day at work. I apparently avoided the rain on my bike commute home. The fact that it’s raining in the middle of February is beautiful in and of itself. I went on a long walk with my dog and then came home and made dinner. Then I fine-tuned my website, witnessed the launch of the huge redesign of OnMilwaukee.com—of which I was a big part—and finally fixed that sound lagging issue that has been bugging me ever since I got this new computer.

This is a blog in three parts.

littletinyfish.com

I spent the better part of the night tonight fine-tuning some more of the styles of the site. Blogs should flow a little bit better and mobile browsing should be a little more consistent. I used to use a TextPattern plug-in to prevent widowed words, but I used it incorrectly in the first place (for titles instead of text bodies). I decided to just get rid of it altogether, but when I deleted it, old articles still retained a…residue, if you will. But I managed to troubleshoot that problem away.

I’m sure this design will be pushed further, but I’m really starting to understand the structure of the site and how fluid layouts work.

OnMilwaukee.com

I can’t take all the credit for the work that was put into the site tonight; that all goes to the company programmers. However the design is something I had big hand in. This time my input went well beyond just the design of individual elements and extended into information layout as well.

The design process started back in October, when we were called out by name by an upstart who said we were not well designed. I used that little insult to take a closer look at what we were doing, what problems I personally had with the site, and then try to solve them.

The work you’ll see is a collaboration between three disparate minds who think in radically different ways. But, by working together and paying attention to everyone’s needs, I think we’ve hit on something great, though I’ll be anxious and nervous to see the difference traffic results. (Hopefully they go up!)

Sound stuttering and lagging issues

Ever since I purchased my new computer I’ve had these strange sound lagging or stuttering issues. Every 15 minutes or so the music from MediaMonkey or Netflix would get drawn out for half a second. It wasn’t a huge deal, but, y’know, it’s just not something you want.

I could not figure out what the problem was and went through complex processes like downloading drivers and flashing the BIOS (a phrase I have always loved and am glad I can still use).

Finally I stumbled upon a solution that was easy to manage, if still a bit time consuming. There is a program called msconfig that allows you to turn off programs and turn them on one by one (or three by three, in my case) and see what happens.

It turns out my Carbonite Backup system was the culprit in causing my lagging and stuttering issue. Carbonite was set to backup files automatically, whenever it felt like looking and those audio lags I heard were the times when Carbonite swept through my system to make sure it had found everything.

The simple solution was to schedule Carbonite to backup less often (every other night when I’m sleeping). It’s not ideal, as flawless automatic backups would be preferable, but now I can make it through a movie fully immersed, without getting kicked out by strange digital stuttering.

If you need help troubleshooting lag issues, here are some instructions for Windows 7 msconfig troubleshooting. This worked for me, but use it at your own risk.

1. Save all your work and close everything down (except this window, of course). It is recommended you save a copy of this page (Click File and then Save Page As…) to your desktop in case you turn off your internet connection in the process.
2. Hit the Windows Key and type msconfig and select msconfig.exe.
3. In the General tab, select Selective startup and make sure Load system services and Load startup items are deselected.
4. Click the Services tab and select Hide all Microsoft services
5. Deselect all programs that remain
6. Click the Startup tab and deselect all of those programs
7. Click Ok.
8. You’ll be prompted to restart your computer, which you should do.
9. When Windows reloads, try to duplicate your issues. If nothing happens, you know you turned off the problem. Now you can go back into msconfig and start turning on different services and startup items, restarting and retesting as you go.
It’s a slow process but it is fairly intuitive and in the end it yielded results. So basically today was great. What will tomorrow bring?

Things are starting to get comfortable here over at littletinyfish.com, and I feel like I need to stretch out a little bit with a more constructive blog. However I can’t think of anything interesting to expound upon, so I’m just going to talk about the assorted media I’ve been consuming lately.

I am one of those guys who can snidely say I don’t own a television, yet still consume the media it produces. Netflix is having a tough time figuring out what it should recommend to me. Between “Home Movies,” “Spongebob,” “Breaking Bad,” and “How It’s Made” it gets a little amusing to see coke fueled movies sitting next to colorful muppets. Or maybe that context actually helps them to make even more sense. I’m also glad to see “Community” isn’t going anywhere…for now.

John K. Samson, lead singer of The Weakerthans, released a new album called “Provincial” which apparently contains those quotes. I’m not sure if it should be surrounded by double quotations, then. It is everything I desire out of a Weakerthans album and it always ends too quickly. First Aid Kit released their new album on the same day. It’s called “The Lion’s Roar” and has fewer hits between the misses. But man, those hits. Sharron Van Etten’s new album, “Tramp” falls in a similar vein. Her song, “Give Out” is a nice kick in the ribs that leaves you wanting more.

“Submarine” is a film by Richard Ayoade and is based on a book of the same name, “Submarine: A Novel” by Joe Dunthorne. It features a kid who is that Wes Anderson style of wise beyond his years. Both pull punches where I wish they didn’t.

“Fish Tank” followed a young English girl who had to deal with Michael Faasbender being hot. It was a movie that couldn’t decide what it wanted to be and was likely better because of it.

“Diary of a Nobody” by George and Weeden Grossmith is late 19th century satire that is easy to follow, but difficult to read in that the book feels entirely pointless. It’s funny, certainly, but the man’s life is so boring and his jokes get exceedingly eye rolling by the end that it’s difficult to want to finish.

The WTF with Marc Maron podcast has been added to my list of audio entertainment. He mostly interviews with comedians, but since comedians deal with actual issues it tends to be funny and fascinating without a lot of the usual overbearing celebrity self importance.

The Tour of Qatar started this week, which means that the cycling season has officially kicked off. While the Tours of Qatar and Oman tend to be a bit boring (flat, windy, always finishing in a bunch sprint) they are normally a welcome respite from the biting cold provided to us by the Wisconsin winter. But so far this year has been the second warmest winter on record with temperatures hanging out above freezing more often than not.

This site will be under construction. The plan is to have the site redesigned by the end of 2012. If something doesn’t work correctly, I’m pretty sure I’m already aware of it. Blogs, image, articles, links, whatever. They may not work.

After the start of January 2012 you can let me know what’s still wrong.

[EDIT: Haha, jk. It’ll be past January before I get this sorted out. When this text changes and you find yourself slightly more oriented you’ll know it’s ready.]

[EDIT 2: Things are falling nicely into place and at this point you should be able to view everything without running into a bunch of display problems. I'm still working on styling, so there are some ugly bits here and there (particularly in the mobile site) but you should be able to find the information you require. This is not an official release just yet, but it is definitely usable.]

List of things that still need fixing:

• List formatting, obviously.
• Homepage.
• Portfolio and Archive sections need reworking.
• Individual gallery pages.
• Individual blog pages.
• Individual gallery pages need some extra styling/finishing
• Individual blog pages also need some extra styling/finishing
• General styling/finishing
• Better background
• My h3 tags (perhaps all my h tags?) are not properly sized
• Image/blog navigation needs sorting
• Restyle error page
• Permalink to full sized images in gallery