Get In Touch

A Look Behind the Code: How We Built 417 Magazine's New Websites

Jarad Johnson, President

Posted on January 25, 2018

A Partnership Forged in 417-Land

In late 2016 we began a relationship with 417 Magazine with an end goal to overhaul every aspect of their websites for three separate magazines. Just over a year later we were proud to launch a stunningly beautiful and thoughtfully effective custom platform that manages all three publications.

We knew going into the relationship that our respective cultures were a good fit. We both like champagne, office parties, The Wheelhouse, and our respective orbits. The powerhouse digital team at 417—Dayle Duggins, JuliRose Sullivan, and Krysten Maloney, all pictured below—were dream partners when it came to utilizing the tools we created to bring the new sites together.

What we didn't know was just how much we would uncover along the way and the many challenges we would overcome to create a new, industry-leading web presence with our partners. This is the story of how we built a custom solution that manages over 5,000 pages across three publications that are read by 59,284 unique visitors per month.

The 417 digital team celebrating the new website launch in January 2018.

Aimee and Maranda coding away into the night in preparation of launch day.


Understanding Audiences

Nearly every new relationship we dive into at Mostly Serious begins with something we call the Groundwork phase. We've built this phase into our existing process and have pruned it over time so we have the tools and resources to fully understand our clients' audiences beyond standard demographics and behaviors. In every iteration of our Groundwork phase we set out to uncover hidden insights that allow us to then build a strategy and product that goes well beyond simply working for a group of people. The ultimate goal is that we'll build something that is highly engaging by meeting needs those groups of people didn't even know they had.

We had undergone this phase of our process many times with great results. Using our standard process in the first pass with 417, though, left us coming up short. We didn't feel we'd found those hidden insights. And their team agreed. So, we started back at the beginning. Not just back at the beginning of our Groundwork phase, but at the beginning of thinking hard about what our Groundwork phase meant to accomplish in this scenario. What went wrong—and how could we fix it?

We settled on acknowledging our Groundwork phase wasn't as one-size-fits all as we had previously anticipated. After this realization hit us, we immediately set out to rebuild the entire phase specifically for 417 and the their audience. We dug incredibly deep into their analytics data (with a tactic we now call—wait for it—Analytics Deep Dive) to find hidden data treasures and several key "Aha" takeaways that revealed site visitors' behaviors and habits beyond just clicks.

We also went through a detailed Click Audit of the existing website to better understand how pages were connected, where users were getting lost, and who the most popular person in Springfield is (sorry, Brad Pitt, but it isn't you). We surveyed dozens upon dozens of readers to get personal answers to complicated questions. And we audited a list of national peers we could use to create a baseline of quality we would strive to surpass.

Our Groundwork research phase deliverables were accompanied by a full 2 hour presentation of insight highlights.

"Mostly Serious was crucial in helping us understand our digital audience and what they want from us."

 Logan Aguirre
Logan Aguirre , President & Associate Publisher at 417 Magazine

This phase uncovered information that didn't just change the trajectory of the project, but presented business opportunities that changed how the website would be used by 417's internal teams. We gathered the results in a key findings suite of documents and presented the insight highlights in a two hour presentation. This phase was some of the most important work we've done with 417, and it required starting over to reach that outcome.

Starting over was one of the best decisions we've made as a company and for our client partners.

We carried through what we learned to solidify our modular process, which is an evolving system of movable pieces that make up each client relationship. Our building block approach ensures each client receives a proven and tailored path to understanding their audience.


A Unique Collaboration

After working to uncover those hidden insights, it was time to begin building. As we lay the foundation of a new project or campaign with our clients, it's not uncommon that we collaborate heavily to ensure the structure, content, and general direction are in line with the findings of our Groundwork phase and the business objectives we've established with our partner.

With 417, things were a little different. We had a unique perspective into the inner-workings of the company through our Director of Design, Jessica Spencer, who had previously worked at 417 Magazine as their Art Director. With most clients, we have a point of contact that bridges the gap between each organization, but with 417, we had the bridge on our own team.

“The 417 team were a dream to collaborate with. For the design process, we worked shoulder-to-shoulder with them to make big decisions on the site’s organization and functionality. Our ultimate product is something that we all agreed was a home run for 417 readers, staffers, and 417’s partnering advertisers—and was a true labor of love for both of our respective teams.”

Jessica Spencer
Jessica Spencer , Director of Design at Mostly Serious

This resulted in the same collaborative process we always use with the added benefit of understanding needs and potential issues during internal conversations and collaborations. We also had the pleasure of witnessing our client note something we may have not known only to see, moments later, Jessica had already thought through the issue and had a solution to offer.

We constructed sitemaps on our whiteboard and got into the Guinness Book of Records for longest collaborative meeting (okay, not really, but only because they don't offer that record—yet). We reviewed wireframe page after wireframe page to ensure the best possible layout for staff and readers. And we underwent a visual design process that resulted in a stunningly beautiful website, able to comfortably stand on the same level as national publications.

Whiteboard sitemap design process for 417 Magazine.

Whiteboard sitemap design process for Biz 417.

Whiteboard sitemap design process for 417 Bride.

Whiteboard sitemap design process for 417 Home.

Wireframes detailed the layout of each unique page on all three publications.

Our visual design effectively translated the 417 Magazine brand while providing a website design that would stand up against national players.


Engineering A Solution

At this phase of many projects our clients are able to step back a bit and wait for the magic to happen (the magic, in this case, was our engineer, Aimee Hendrycks, coding furiously for months). By this point in most projects we've made many decisions during the Groundwork and design phases that set the stage for most of the engineering work to come.

If you haven't picked up on it yet, this project was not like most projects.

We had made many important decisions, but the reality of our desired timeline was not going to allow for the typical breathing period. In fact, it was going to require our team to jump into our modular process toolbox and find a way to work around time constraints.

Our solution was two-fold: break pages down to components and deliver those components in phases, allowing the 417 digital team to begin populating the website with content while we were still coding. Spoiler—it worked. It made the content population phase, which consisted of manually porting over hundreds of pages of content, less labor intensive for the 417 team. 

Our component breakdown of pages allowed for a more rapid development process broken into delivery blocks.

The Mostly Serious website development team working through the night to launch the new website.

While our team programmed the pieces together beautifully (and turned one of our conference rooms into a do-not-enter-unless-you're-on-417-business-area) the 417 digital team were trained on the content management system. Back at their headquarters, they added content and explored the features we had delivered up to that point.

We programmed. They populated. We coded. They wrote. We polished. They polished. On January 24, 2018, we were ready to launch the fully featured, newly imagined 417 Magazine website—right on schedule.

To learn more about the features we included to make this project a success, check out our detailed case study on this project or visit the 417 Magazine launch announcement post. And have a look around while you're there.


The Importance of Local Partnerships

We are extremely proud of what we created with 417 Magazine. The design, management system, and feature list will continue to help us illustrate how we provide value for our clients. For every new project we take on we hope to find ourselves in a similar place at the end—with a client who finds value, happy readers (or customers), and a solution that benefits their business for years to come.

But the product isn't what we're most proud of. We're most proud of the partnership we established with a local company that is respected in the community. Much like our other partners, CoxHealth, Holloway America, Mother's Brewing Co., The Larson Group, The Lipco Group, The Community Foundation of the Ozarks, and many more, we are focused on building great relationships that make a difference in our community.

Thank you to 417 Magazine for finding a local partner and trusting us with a project very important to their business. And thank you for reading this. Now, go read much better things over at 417 Magazine's new website.

Want more? Sign up.

We’ll keep you up to date on our latest articles and insights. Sign up for our newsletter:

Oh, We’ve Got More

Ready to talk? So are we.