Tag: UX Design

  • A New Look for Every Business Page, Balloons Over the Map, and an Obituaries Page

    A New Look for Every Business Page, Balloons Over the Map, and an Obituaries Page

    Every business page on Bloomington Online has a new layout today, and the 3D map has hot air balloons drifting over town. Working with Claude Code, we also built an obituaries page, rethought how a listing page should read, and put together a plan to bring the whole business directory up to date over the next few months. Here is what changed, with the screens to show it.

    A business page that answers the question first

    The business directory is the most important part of this site, so today I asked for a UX review of the listing page. The old page opened with four buttons of different sizes, and the address, links and tags were stacked in a column next to the logo. Someone who only wanted the hours or a phone number had to scroll to find them.

    The new page opens with a short intro line in the first screen, then three equal buttons: Website, Call and Directions. Everything a person needs on the way out the door sits in a card called At a glance: address, hours, phone, social links, a link to the business on the 3D map, and when the listing was last checked. On a computer the card stays in view as you read. The description, photos and specialties fill the wider column beside it.

    Side by side screenshots of the Mays Greenhouse listing page in the old and the new layout
    Mays Greenhouse before (left) and after (right). Same business, same facts, a clearer order.

    On a phone the card moves to the top so the address and phone number come before the long description, and the buttons turn into big icons. We checked a sample of listings for errors and the page scores 100 for accessibility in Google’s Lighthouse test.

    Phone screenshot of the Mays Greenhouse listing page with Website, Call and Directions buttons
    The same page on a phone. The buttons are large and the first screen already has the basics.

    Not every listing has a logo, photos and a website, so we also made sure the page holds up when it does not. This one has only a phone number and an address, and the card simply takes the full row instead of leaving a hole.

    Screenshot of the Dome Grown listing, a business with only a phone number and address
    A listing with no photos or website still looks finished.

    One more thing is new behind the scenes: the page now counts taps on Directions and the 3D map link, alongside the website and phone taps we already tracked. Before this change, about 16 percent of listing visits ended with a tap on the website and 1 percent with a call. Now we can see whether the new layout moves those numbers, and we will check back in a couple of weeks.

    Hot air balloons, and the birds of fall

    I wanted the map to feel livelier, and something specific to Bloomington. Fall is hot air balloon season here, so from mid September to mid November balloons now drift across the 3D map. Some carry a local business, such as Oliver Winery and Indiana University Credit Union, and one is a rainbow. Tap a balloon and its directory listing opens, so a bit of fun becomes a way to find a business.

    Hot air balloon with the Oliver Winery name over the Indiana University campus on the Bloomington 3D map
    A balloon carrying the Oliver Winery name floating over the IU campus, with the live clock showing early evening.

    The sky has other visitors too. Geese pass overhead on their way south through November, turkey vultures circle until the end of October, and a small plane crosses now and then. Each is tied to the calendar and the map clock, so slide the clock to evening and you will see a different sky than at noon.

    Two turkey vultures flying over the Bloomington 3D map
    Turkey vultures circling over the south side of town.

    We also stretched the edge of the map. A few businesses sit well outside town, like Oliver Winery, and used to have no pin at all. They now show up at the rim of the map with a link to their coordinates, so nothing is left off the map just because it is a few miles out.

    An obituaries page, built carefully

    People look for obituaries here more than you might guess, so there is now a page for them under Resources. It lists recent notices from Bloomington-area funeral homes and news feeds, shows a short opening for each one, and always links to the full obituary on the publisher’s own site. A search box finds a name, and funeral homes have cards of their own. Families can send us a notice through a form, and nothing goes up until I approve it.

    The page needs to be respectful, so we keep it plain and show only what the publishers share. The screenshot below shows just the top of the page. We left out the names on purpose.

    Top of the Bloomington Online obituaries page with an explanation of sources and a name search box
    The top of the obituaries page, with search and the explanation of where each notice comes from.

    The weekly email now carries a link to the page as well.

    A plan for the whole directory

    There are about 2,500 businesses in the directory. When we counted, about 1,700 of them had only a thin description, around 2,000 had no image, and many had no tags. Traffic is small, so accuracy and timeliness matter more than anything else. A stale hour or a wrong phone number costs a local business a customer.

    As a first test we refreshed 13 hardware stores and garden centers. For each one we read the business’s own website, rewrote the description in our own words, fixed the address and phone, added hours, tags and a logo, and added photos from the business’s own site with credit. The ones we could not verify we left alone and flagged for a phone call. We also wrote Gmail drafts to the owners, so they know what we changed and can correct us.

    The plan is steady rather than fast: about 100 listings a week, the seasonal categories first, and a regular check for dead websites. It should take around 16 to 18 weeks, and I review a sample before anything bigger goes out. A wrong fact hurts a small business, so accuracy comes before speed.

    If you own a business here

    Look yourself up in the directory and tell us what is wrong. Every page has a Suggest a correction link. If you have photos you would like to show or hours that changed, send them in. If you do not have a listing yet, adding one is free.

Bloomington this week, in your inboxOne short email every Monday: upcoming events, new businesses and local news. Free, and you can unsubscribe in one click.