Maven.io Platform

In just three short years, Maven.io catapulted its reach, amassing an astounding 150 million MAU. The platform became a melting pot for diverse content creators, from article writers and YouTubers to podcasters and news reporters, equipping them to both share their stories and engage their communities. Taking into account the colossal task of designing and navigating this vast platform, it's significant to highlight that the responsibility was shared by just two designers. My role was pivotal, deeply rooted in strategic ideation, complex problem-solving, and creating intuitive design solutions. This endeavor was not a sprint; it was a marathon, filled with challenges, constant iterations, and a laser focus on user experience.

Maven.io's inception was influenced by scout.com, a website that effectively combined sports news with a community forum. As Maven.io embarked on its growth journey, it not only expanded its reach but also merged with notable platforms such as HubPages, Say Media, Sports Illustrated, and TheStreet. This evolutionary phase culminated in our rebranding as 'The Arena Group' in 2021.

Scout.com's data provided an illuminating insight: while forums were the main traffic drivers, it was the professionally crafted articles that brought in the lion's share of ad revenue. This revelation paved our path forward, setting the stage for our goal to seamlessly marry publishing functionalities with vibrant community features.

Maven.io's roots lie in scout.com, a platform known for its bustling online community forum. This forum was a significant traffic puller, accounting for 70% of the platform's visits. In contrast, the professionally curated articles, though fewer in number, were the primary contributors to the revenue. This scenario showcased a distinct separation between the forum and the articles, with each operating in its own silo.

**The Newcomer's Blindspot:** Many first-time visitors, typically directed from search engines, remained unaware of the vibrant forum. Their experience was confined mainly to the articles, sidelining the forum's potential for engagement.

**Habits of Loyal Users:** Regular users of the forum, despite expressing interest in professionally written content, often stuck to their familiar browsing patterns. This habitual behavior restricted them from exploring the articles on offer.

**The Engagement-Revenue Paradox:** A clear discrepancy emerged. The engagement-driven forum wasn’t a significant revenue source. Meanwhile, the revenue-generating articles lacked the forum's engagement levels. This dichotomy called for a solution to unify both experiences for better revenue and engagement.

The challenge ahead was to re-envision Maven.io, intertwining community discussions with professional articles, thereby creating a synergistic platform that optimized both engagement and revenue.

To gain a comprehensive understanding of our user base, we undertook a deep-dive analysis. This involved not only tracking online interactions but also conducting home visits to grasp the intricacies of user behaviors. Observing users in their natural environment illuminated distinct patterns of interaction—how they navigate the site, the frequency of their visits, and the amount of time spent on each session.

Our data demarcation showed clear delineation between two primary user types: recurring forum enthusiasts and first-time visitors. While recurring users showcased loyalty, diving deep into discussions, first-timers often skimmed through content, potentially in search of a hook or familiar topic. This distinction reinforced the need for a design that catered to both browsing patterns, ensuring content accessibility and discoverability for all users.

Direct interactions with users revealed a significant pain point: difficulty in discovering varied content. With an amalgamation of professional articles and community interactions, users often found themselves overwhelmed or unable to locate specific content. This feedback was invaluable, highlighting the necessity for a more streamlined content discovery process, paving the way for our subsequent design interventions.

Recognizing the unique challenges and potential of Maven.io, our primary vision was to evolve the platform into a comprehensive hub, where community interactions and professional articles coexisted harmoniously. This integration was pivotal, considering the discrepancies we observed between forum-driven traffic and advertisement revenue stemming from articles.

**Community Engagement:** We aimed to amplify the forum experience, nurturing user interaction and engagement. Recognizing the loyalty of our recurring forum enthusiasts, it was imperative to provide them with an enriched experience, ensuring they remained actively involved.

**Content Amplification:** On the other hand, we sought to bolster the discoverability and reach of professionally crafted articles. These articles, vital for ad revenue, required a platform where they were easily accessible, especially to first-time visitors scouting for engaging content.

By converging these distinct avenues, our ambition was to seamlessly merge content creation with community, fostering an environment where users could indulge in rich articles while actively participating in community discussions.

Maven.io catered to a diverse user base, each with its unique motivations and patterns of engagement. We distilled them primarily into:

• **Devoted Community Users:** An active subset that contributed to and shaped the community's landscape. Their participation was organic, frequent, and significantly influenced the platform's pulse.
• **Casual Users:** A larger group, often passive in their interaction, primarily consuming the content Maven.io offered without diving deep into community features.

Balancing the aspirations and needs of these distinct user groups in one cohesive platform was our challenge.

**Blended Articles and Community Interactions:** An innovative approach where every article became an interactive community node. The result? The article wasn't just a passive piece of content; it was an avenue for dynamic user engagement, making community interactions an integral aspect of content consumption.

**Exploring Comment Structures:** Our endeavor was to find a comment system that would resonate with our diverse user groups.

**Facebook-like Reply System:**

• **Pros:** Promoted broad participation.
• **Cons:** Difficult navigation for power users.

**Traditional Forum Threads:**

• **Pros:** Preferred by power users..
• **Cons:** Dated appearance; intimidating for casual users.

**Nested Threads (Reddit-style):**

• **Pros:** Can facilitate complex discussions.
• **Cons:** Mobile layout issues; discussions can become overly intricate.

We embarked on our journey by adopting a Facebook-styled reply section. This setup aimed to simplify community interactions, offering a familiar and universally recognized engagement pattern. However, a significant drawback was the diminished appeal to our devoted community users, who sought a more comprehensive engagement experience.

**Outcome:** Simpler interactions but less appealing to power users.

**Feedback:** Some power users found value in the new features, yet others found them excessively intricate.

**Interactive Breadcrumbs and Pagination:** We tried breadcrumbs that displayed a user's navigation journey within threads. This feature aimed to assist users in retracing their steps or jumping between discussions.

• **Pros:** Enhanced user navigation.
• **Cons:** Added another layer of UI complexity.

**Quick Reply Options:** Users could choose pre-defined responses for swift interactions.

• **Pros:** Faster engagement for casual users.
• **Cons:** Limited depth in interactions.

**Dynamic Content Pop-Ups:** On hovering over a thread, users were provided with a snapshot of the discussion, allowing them to gauge relevance before diving in.

• **Pros:** Streamlined content consumption.
• **Cons:** Hover interactions posed challenges on mobile interfaces.

Feedback from these iterations was mixed. While some power users relished the new features, others felt overwhelmed by the layers of interactivity. This feedback became instrumental as we moved towards our final design phase.

**Design Decision:** A sleek, intuitive UI that concealed advanced features within pop-up menus, ensuring a non-intimidating environment for novices.

**Key Features:**

**User Interface:** We embraced a minimalistic design, delegating advanced features to pop-up menus, ensuring the primary interface remained clutter-free and welcoming.

**Reply Depth:** Setting a cap, we limited threads to two levels of replies. Our studies affirmed that these two levels sufficed for most discourse on the platform. For deeper engagements (level 3 and beyond), we nestled them within level 2 replies, ensuring readability wasn’t compromised.

**Navigation Enhancements:**

• **Hybrid Pagination System:** To optimize user experience while managing extensive threads, we combined pagination with a "load more" approach. This ensured quick access to earlier and later parts of discussions, while also allowing users to incrementally delve into conversations without being overwhelmed.
• **Permalinks:** Introduced permalinks atop replies beyond level 2, guiding users to overarching conversations.
• **Drawer Panel:** Derived from Slack's design, a right-hand drawer was integrated for level 2 replies, enhancing the browsing experience.

**Profile Presentation:** To sustain a minimalist UI while meeting users' personalization needs, pop-up profile cards were initiated.

This methodical approach, shaped by research, testing, and feedback, ensured that Maven.io remained an inclusive platform, celebrating both depth and breadth of user engagement.

With a burgeoning community of content creators on Maven.io, each with unique channels, we recognized a challenge - no two channels had the same requirements. The platform's growth added more layers of diversity, pushing us to rethink our approach to content presentation.

Being the gateway to every channel, the stream view's significance was unparalleled. We needed it to not just present content but to encapsulate the ethos of each channel and cater to our two primary user groups:

• **Casual Users:** Driven by visually compelling content, these users sought captivating images and headlines.
• **Forum Enthusiasts:** A community that valued scannability and was keen on deeply engaging with user-generated content.

Our journey began with various mockups (as showcased on top), symbolizing our early forays into finding the perfect blend of aesthetics and functionality. These mockups reflected our attempts to cater to the distinct needs of different channels, each bearing its own unique demands.

After extensive testing and iterations, our solution crystalized in the form of three distinct views: large, medium, and small.

• **Large View:** Primarily visual, this view was meant for channels that relied heavily on imagery or media previews, making it a preferred choice for news-centric sites aiming to draw users with impactful visuals.
• **Medium View:** Striking a balance between imagery and text, it catered to channels with a mixed content approach.
• **Compact View:** Designed for channels with fast-paced, dense content, this view prioritized text, making it ideal for community-driven channels.

In our quest to ensure user-centricity, we allowed channels to set their default views, ensuring that they could align the user experience with their content strategy. This also meant that channels could craft unique first impressions tailored to their identity.

Moreover, we empowered our power users by allowing them to override default settings. They could choose their preferred view, providing them with an unparalleled level of control and personalization.

In essence, the evolution of the stream view on Maven.io was a testimony to our commitment to catering to the diverse needs of our community, ensuring that every user found their niche and every channel could shine in its own unique way.

Maven.io serves a vast array of unique content creators, each operating their own distinct site or channel. Ensuring a smooth and efficient login experience was paramount to us.

**Original Approach:** Our initial method, was multifaceted and cluttered.

**Challenges:** Seeking simplicity revealed its complexities. Traditional username-password combinations introduced security challenges and necessitated unique usernames across channels. However, our strategic objective emphasized email collection.

**User Flow**

Our flow chart, are the result of meticulous planning and insights. These blueprints were pivotal in preempting potential obstacles at the early phases. Due to its efficacy, we also adopted this flow for the Sports Illustrated App, yielding significant time savings.

**OAuth Challenges:** While users preferred OAuth for its convenience, it occasionally masked their emails during the login process, conflicting with our objective of email collection.

To address OAuth challenge, we also added an email collection flow after users log in and engage with content. This minimized disruption to the login process and increased the likelihood that users would provide their email addresses.

**Solution**

We discarded passwords, opting for a passwordless two-step login, relying on email uniqueness. We engineered an alternative flow, capturing both email addresses and username setups while maintaining ease of use.

Our initial designs, featured both a sidebar and hamburger menu. Feedback revealed their redundancy and distraction.

**Objective:** As Maven.io expanded, we recognized the need for a streamlined network facilitating channel interactivity across the entire platform. The objective was to implement a "universal" navigation system that would be consistent across all channels, sub-brands, including SI and TheStreet.

**Solution:** We refined our UI components, assimilating primary navigation features into the hamburger menu. This adaptation not only ensured seamless compatibility across diverse channels but also strategically guided users, promoting recirculated traffic within the platform and fostering user discoverability and cross-channel engagement.

One of the fundamental features we introduced in Maven.io was the Infinite Scrolling mechanism. Its inception stemmed from the observed user behaviors on platforms like Instagram and Twitter, where a continuous flow of content seemed to be the preferred mode of content consumption.

However, post-implementation feedback painted a slightly different picture. While many appreciated the uninterrupted browsing experience, a segment of our users found themselves feeling inundated. The challenge? An overwhelming volume of content, coupled with the difficulty of navigating back to specific content pieces or even resuming from a particular spot.

This feedback was invaluable. It signaled that while fluidity in content presentation is cherished, it's crucial to strike a balance. Usability and content organization cannot be compromised for the sake of an uninterrupted flow. Our team took these insights to heart, realizing that user preferences are multifaceted and that design solutions need to be adaptive to cater to a diverse user base.

Beyond the primary project, my involvement extended to several supplementary features and projects integral to the Maven platform. These encompassed the notification center, channel dashboard, Digital Subscription Flow for TheStreet, and the bio.com redesign. Each played a pivotal role in elevating the overall user experience.

A cornerstone of this project was crafting a comprehensive stylesheet and library.

**Purpose:** These tools not only fostered design uniformity across Maven.io but also amplified the efficiency of our design procedure. Such foundational elements were crucial in preserving a cohesive brand identity.

**Design Evolution:** A significant visual and stylistic revision was rolled out in 2019. Earlier mockups retained the preceding style, leading to a noticeable contrast in old versus new designs. Nevertheless, our final product has been refreshed in line with our contemporary design language.

While the main thrust of our project was elsewhere, the significance of mobile accessibility could not be sidelined. Hence, in our relentless pursuit of superior user experience, we embarked on the Maven app journey, notwithstanding it wasn't the primary focus.

**Objective:** Even with resource constraints, we prioritized core functionalities, refining the app's mobile design and flow.

**Outcome:** Compact in scope, the app was both functional and acclaimed by our publishers, extending our platform's accessibility and reach.

At the heart of Maven.io's journey lies the ethos of iteration and continuous improvement. As with any innovation-driven endeavor, our commitment to Maven.io was marked by consistent adaptation and enhancement. Through countless feedback loops and rigorous testing, we constantly revisited and reshaped our designs and strategies to align with our overarching objective: to weave a harmonious platform for content exploration and community engagement.

Our adaptation of the "Blended View" serves as a snapshot of our iterative approach. While our original Stream View was apt for a certain digital landscape and audience, we found ourselves navigating new challenges as Maven.io scaled. The juxtaposition of community feed and sidebar advertisements is but one example of how we evolved to meet the evolving needs of our users and partners. By adopting a fluid, user-centric design strategy, we ensured that while the platform's core remained consistent, it was malleable enough to adjust to changing external dynamics.

However, this is just one glimpse into the many adaptive steps we took over the course of Maven.io's growth journey. In essence, our experience with Maven.io underscored that design is not static; it thrives on feedback, evolves with challenges, and flourishes with adaptability.

Over a span of two years, our iterative approach morphed Maven.io from a straightforward publishing platform to a bustling community nexus.

Our design choices reflected in marked growth across vital metrics:

• Web session lengths grew by 25%, indicating heightened user engagement.
• A 15% dip in bounce rate signaled users finding greater resonance with our content and interface.
• User interactions, including likes, shares, and comments, saw a 40% rise, underscoring the effectiveness of our community-centric features.
• A 30% growth in page views per session meant users delved deeper into our content during each visit.
• The return user rate shot up by 35%, showcasing the platform's growing allure and user satisfaction.

Most notably, Maven.io burgeoned from its inception to a staggering 150 million monthly active users. This growth trajectory underscores the triumph of our design evolution.

To sum it up, for us at Maven.io, UX isn't a final stop but an ongoing voyage. Our commitment to continuous enhancement has fostered a more interactive, engaged, and contented user base.

Embarking on a long-term project like Maven.io brought with it a myriad of insights. Some key takeaways include:

• **Nurturing Team Growth and Trust:** Over the course of the project, our collective experience fostered a deep-seated trust within the team. Understanding each member's strengths and capabilities allowed us to lean into each other's expertise, resulting in more efficient collaboration and quicker decision-making.
• **The Power of Self-Motivation and Resilience:** The longevity of the project tested our determination and commitment. Maintaining a high level of self-motivation ensured that we consistently pushed boundaries, always striving for innovative solutions and improvements.
• **Adaptability:** Embracing change is crucial in our ever-evolving digital landscape. We learned to pivot when necessary, always keeping user needs at the forefront.
• Empathy: It remains central to our design philosophy. By continuously placing ourselves in the user's shoes, we ensured our solutions were both intuitive and impactful.
• **Persistence:** Challenges and diverse feedback were commonplace. With a firm belief in our vision, we navigated these hurdles, refining our designs based on valuable insights.
• **Growth Mindset:** Each challenge was viewed as a learning opportunity, not as a setback. This approach fortified our resolve and encouraged continuous learning and evolution.

In wrapping up, Maven.io's journey has been a remarkable tapestry of challenges and triumphs. Each success has given us moments of pride, but it's the hurdles we've overcome that have imparted the most valuable lessons. Every phase brought fresh insights, molding our perspectives and refining our approach. These collective experiences have truly shaped our journey, making it both rewarding and enlightening.