Blog
Redesign
.png)
Transforming the Splunk Blog: A Seamless Migration and Modern Redesign for Readers and Publishers
Role :
Lead UX Designer, Researcher
Company :
Splunk
Tools :
Figma, Miro, Mouseflow, Google Analytics
Design Process
The design process included multiple overlapping stages that were often developed in parallel rather than following a strict linear path
Research /
Analysis
Step 01
-
User Research
-
User persona
-
Competitive Analysis
-
Heuristic
-
Usability testing
-
Stakeholder Interviews
Ideation /
Testing
Step 02
-
Low fidelity wireframes
-
Usability Testing
-
Iterations of Edits
Design
Step 03
-
Interactive prototyping
-
User Testing
User Persona
We designed the new Splunk Blog with two key users in mind — the readers who come to discover insights and the authors who bring those stories to life. Our goal was to create an experience that’s equally intuitive for consuming content and publishing it.
Author
OCCUPATION: Content Marketing Specialist
Backgrounds:
Taylor is a skilled content marketer with a deep understanding of the tech industry. With a background in digital marketing and a passion for technology, Taylor excels at creating engaging blog content that resonates with the company's target audience.
Age: 32
Frustrations:
-
Finding creative ways to differentiate the company's blog from competitors and capture the attention of busy tech professionals.
-
Measuring the effectiveness of blog content in terms of engagement, traffic, and lead generation, and optimizing strategies accordingly.
Goals:
-
Showcase the company's expertise and innovative solutions through informative and insightful blog posts on relevant topics in the tech industry.
-
Increase brand awareness and drive website traffic by producing high-quality blog content that attracts and engages the company's target audience.
Reader
Age: 28
OCCUPATION: Software Developer
Backgrounds:
Ryan is a software developer who holds a degree in computer science and works for a tech startup, where he's involved in developing cutting-edge software solutions. Ryan is eager to learn and stay updated on the latest trends, tools, and best practices in the tech industry to enhance his skills and knowledge
Goals:
-
Stay informed about the latest developments, updates, and trends in the tech industry to remain competitive in his field.
-
Find practical solutions, tips, and insights to overcome challenges and improve his coding skills and software development practices.
Frustrations:
-
Finding credible and reliable sources of information amidst the abundance of content available online.
-
Keeping up with the rapid pace of technological advancements and innovations, which can sometimes feel overwhelming.
Goals
Blogs drive brand authority, SEO, and customer trust. Our goal was to redesign the experience to make writing effortless for authors and reading inspiring for audiences.
1
Design a layout that was flexible, engaging, interactive and reflects our brand personality
3
2
Increase Organic traffic and subscriptions
Migrate Blog subsite into SPlunk.com main site
Challenges
Every project comes with unexpected twists, and this one was no exception. Throughout the redesign and migration of the Splunk Blog, our team faced several obstacles — from sudden resource changes to shifting workflows and technical limitations.
Losing resource
Unexpected layoffs within our organization, led to a sudden shortage of manpower and expertise. This placed additional pressure on the remaining team members and required us to adapt quickly to take on new roles and responsibilities.
How I adapted:
-
Leverage our design system to use existing components to reduce development cost and time
-
Scaled back our designs to ensure component and layout were flexible and reusable throughout the blogs site
skill limitations
Working with authors who had limited knowledge of image resizing and design constraints posed another challenge. This restriction hindered our creative freedom and compelled us to find innovative solutions within the given limitations.
How I adapted:
-
Designed image containers that had 3:2 ratios so images that author are using crop nicely.
-
Designed components that flow well together which allows authors most flexibility to drag drop component to make interesting layouts and content.
new way of working
During our project our company decided to switch to agile method. This cause our whole team to be restructured and team members being moved to new teams. However we had to continue finishing the project while on separate teams.
How I adapted:
-
Attend agile training workshops
-
Read books and articles to understand the agile method
-
Maintain a consistent line a communication between project manager and team members
Heuristic Report
Conducted a heuristics on Splunk blogs focusing on: Navigation throughout the blogs experience Information architecture, blogs categorization and tagging and overall page design, look and feel
Interview feedback
I also interviewed our authors to understand their wants and needs
Insights from interview:
-
Authors want to be able to display more than one author on blog post
-
Authors want flexibility in layout
-
Author want to be able to have recommended articles at the end of every post
Findings
-
Category title is small and hard to read
-
No preview description about blog post
-
Inconsistent Author image sizes
-
Some blog titles do not display
Competitive analysis
Web UX analyzed several competitor blogs experiences and identified opportunities that we could potentially incorporate into the redesigned Splunk blogs experience
Opportunities:
-
Create a dynamic, interactive, engaging, and fun editorial experience that speaks to our brand personality
-
Use a mixture of ways to break up the body content to make it more dynamic and easier to digest, preventing them from being a wall of text.
Ideation
These mockups went through 3 rounds of user testing and stakeholder feedback. Over 50 wireframes were created for both mobile and desktop
Usertesting
I built a prototype using Figma and tested the new designs through user testing. I had a total of 20 participants, 10 for mobile and 10 desktop.
Easy to navigate through the blogs on desktop
The navigation on mobile needs to be easier for users to get go back to previous page.
Use of bold titles to help breakup text in blog post
jump links within a blog post useful. It allowed them to navigate quickly to the section they care about the most
The amount of information displayed mobile
There is confusion on where they click to return to blogs homepage
_gif.gif)
Refined Solution
HIGHLIGHTing IMPORTANT BLOG POST
One of our goals was to design a layout that was flexible, engaging, interactive and reflects our brand personality.
So we created multiple ways for our authors to highlight blogs that deserve the spotlight.
Authors have the option to highlight a blog post all by itself. This can be used to display content about important and exciting information about the business
Another options authors have is to highlight a article within a certain category while also displaying article around it. This options create hierarchy and lets readers know what they should pay attention to.
Strategic Promotional Content
To drive engagement and conversions, we introduced a sticky promotional card that follows users as they scroll through a blog post. Each asset dynamically aligns with the content topic — promoting relevant product tours, free trials, or white papers. This approach keeps the experience contextual and non-disruptive while giving Splunk new opportunities to increase conversions and deepen user engagement directly within the reading experience.
We wanted to make it easier for readers to explore more content from authors they enjoy. By clicking an author’s name on any blog post, readers are now taken to a redesigned author page showcasing all of that author’s work.
To improve efficiency, we repurposed the existing author bio component from blog posts and placed it at the top of the author page. This approach streamlined development, reduced cost, and reinforced component reusability across the site.
Author page redesign
Author page redesign
We wanted to make it easier for readers to explore more content from authors they enjoy. By clicking an author’s name on any blog post, readers are now taken to a redesigned author page showcasing all of that author’s work.
To improve efficiency, we repurposed the existing author bio component from blog posts and placed it at the top of the author page. This approach streamlined development, reduced cost, and reinforced component reusability across the site.
Key Takeaways
To help readers quickly understand the value of each article, we introduced a Key Takeaways component at the top of every blog post. This section highlights the main insights and themes of the content, allowing users to gauge relevance before reading in full.
By surfacing high-level information early, we improved content clarity, scannability, and user satisfaction—ensuring readers can easily find what they’re looking for without unnecessary scrolling.
Key takeaways
To help readers quickly understand the value of each article, we introduced a Key Takeaways component at the top of every blog post. This section highlights the main insights and themes of the content, allowing users to gauge relevance before reading in full.
By surfacing high-level information early, we improved content clarity, scannability, and user satisfaction—ensuring readers can easily find what they’re looking for without unnecessary scrolling.
During user testing, readers shared that excessive scrolling—especially on mobile—made it difficult to explore more articles. In response, we introduced a carousel component leveraging our design system to showcase additional content in a compact format.
This change improved content discoverability and overall usability, ensuring readers could easily browse more stories without the fatigue of endless scrolling.
Reducing Scroll Fatigue
_gif.gif)
Reducing Scroll Fatigue
During user testing, readers shared that excessive scrolling—especially on mobile—made it difficult to explore more articles. In response, we introduced a carousel component leveraging our design system to showcase additional content in a compact format.
This change improved content discoverability and overall usability, ensuring readers could easily browse more stories without the fatigue of endless scrolling.
Enhancing blog previews
We redesigned blog previews to help readers make more informed decisions before clicking into a post. Previously, previews only showed a small image and publish date, offering little context.
The new blog card design delivers richer information at a glance — including reading time, a clickable category tag that connects to related posts, and a concise description summarizing the content. This update improves content clarity, navigation, and engagement, giving readers a better sense of what to expect before diving in.
Before
After
To strengthen engagement beyond individual posts, we added a subscription button and social links at the bottom of every blog page—making it easy for readers to stay connected with Splunk.
This enhancement not only improved accessibility to ongoing content but also led to a 100% increase in blog subscriptions from February 2023 to February 2024.
Connecting with readers
As part of migrating the blog into Splunk.com, we needed to ensure users could explore blog content freely without losing access to the main site. To achieve this, we introduced a sub-navigation bar that lives directly beneath the global navigation.
This structure creates a clear separation between the main site experience and the blog ecosystem, allowing readers to seamlessly browse articles while maintaining quick access to Splunk’s core pages and products.
Rethinking Navigation During Migration
