MacRumors
rebuilding an iconic apple community to be modern and performant
purpose
MacRumors attracts a broad audience of both consumers and professionals interested in the latest Apple news, products, rumors, and reviews. Along with an editorial website, they have an active community focusing on purchasing decisions with close to 30 million posts.
Over the years and with continual front-end changes, the main website had started to become cumbersome for the MacRumors development team to update and keep consistent. With a question of how to fix the disconnect and performance issues, we were approached by MacRumors to aid them in finding optimal solutions. In tandem, we would upgrade their forum software and community design for a new, modern, and quick-loading MacRumors moving forward.
services
- ui/ux
- community development
- integrations
- optimization
exploration of an iconic brand
exploration phase
When approached to re-build the framework, a question that came up was if and how much the design of the main website would change. The brand was iconic and current members resonated with the design language that had become distinctly known as MacRumors. To answer that question, we collaborated one-on-one with the client in creating a moodboard to explore new ideas and iterations. The key was to retain the integrity of the existing design but modernize in a way that is still genuine to the brand and users.
Following the Human Interface Guidelines and a study into other news sites in how they delivered articles, padding, type scale, and legibility, we set on a discovery phase. The phase culminated in different navigation options, brand elements, a refinement of the logo, and numerous article styles.
small refinements
After exploring, we ultimately decided the best solution was to keep the design similar. We would freshen up the colors, limit the amount of colors across the site, refine the type scale, and ensure all components are consistent throughout.
community design for avid Apple fans
community interface
We’ve been collaborating with MacRumors since 2015 when we first helped them re-design their community and migrate them from vBulletin to XenForo. The design update was fairly large from a traditional forum layout to a gridded one with cards to highlight the different Apple devices.
Years later, we upgraded the forum once again from XenForo 1 to XenForo 2 and with it came subtle improvements to the community. The original design was a clean and strong interface that certain elements remained unchanged. We focused on the details of typography, spacing, legibility, and consolidating the forum list into one that was easily digestable and distinct different categories.
re-building the framework for consistency
laying the groundwork
We partnered with MacRumors team for a complete rebuild of their main editoral website in tandem with upgrading their forum software. The main website had become cumbersome to update and keep consistent throughout the years. With subtle front-end changes to colors and components in those years, there started to be a disconnect and it had become difficult to fix development-wise.
Our team decided on using React as we were familiar with it from past projects and big proponents of the scalability of the library.
benefits to react
Using React not only improved the performance of the website but it also helped in 1) simplifying the build process for introducing more modern features and 2) a faster development process by utilizing common components.
optimizing for performance
improving performance
Improving performance and SEO ranking was one part of the rationale behind re-coding the front-end with React. Before changing the tech stack, MacRumors was rated around the mid-40s in terms of overall performance. With building in React, we had the most flexibility in how we could optimize by:
- Removing large dependencies like jQuery by rewriting all JavaScript to not require them
- Reducing the size of stylesheets using modern build tools and CSS modules rather than a single large stylesheet that can be hard to maintain
- Optimizing the initial render by removing or deferring previously blocked content
With the measures above, our development team were able to improve Google’s Lighthouse score from 42 to 96.
Before the upgrade
After the upgrade
building a twitter bot for the buyers’ guide
more accessibility
MacRumors rolled out a new feature with Buyer’s Guide. It acts as a guideline and product summary for each Apple model to better inform buyers about release dates, recommendations, and product cycles. It’s a one-stop-shop for consumers to know when to buy and when not to.
With the new feature being introduced, the client wanted it to be more accessible to users and drive more traffic to that area of the site. To do that, a Twitter bot was built.
When asked whether a product should be purchased, the bot is able to inform users how recently a product has been updated, whether or not that product is a good buy, and even links them to additional information about the product.
building the bot
Our product development team worked to create a syntax to decide if a reply was for buying a product or if the bot should reply at all. The bot was able to form these responses by using the API data from the MacRumor’s official Buyer’s Guide.
statistics that show improvement
the numbers
The overall goal for MacRumors was consistency in their design language, a performant React build that could scale, and improving the interface and user experience subtly to the needs of their audience. MacRumors has an avid community of readers and contributors but with a fast-loading website that delivers a clean interface, a further goal was improving engagement and bringing in new members. We evaluated the year prior to the project to the following year after the new update.
51%
27%
55%
11%
User registrations increased 39%
Daily average users active increased 16%
Audentio has been a pleasure to work with. Not only is their work technically excellent, but they are also easy to communicate with and responsive to our needs and goals. We have been very happy with their work.
