The Mindline Story

Growing up, I was never the best in school—especially when it came to history. Memorizing dates, events, and timelines felt like an impossible task. I’d often sit in class and wonder: Why does history have to be so boring and hard to follow?

It wasn’t until 2009 that a small idea sparked in my mind: What if there was an app that allowed you to scroll through history as seamlessly as you scroll through your contacts on a phone? I pictured a ruler-like train track, filled with dates and events, stretching across the screen horizontally like time itself—and expanding vertically when you needed to dive deeper. It would be fast, intuitive, and visually engaging, turning history into something you could explore rather than memorize.

Then came the rise of social media—a revolution in how we interact and communicate. I realized the power of social media wasn’t just in sharing thoughts; it was in how group communication and comments could reshape perspectives. I saw an opportunity to combine this idea with history. What if people could not only scroll through events but also share their thoughts, learn from alternative perspectives, and spark conversations around historical moments? Imagine students discussing the Revolutionary War or the Renaissance, not just reading about it in a textbook.

   Project Overview

  • Project Overview: MindLine is an app designed to help users explore historical events through an interactive timeline and user-friendly features, making history engaging and accessible.
  • Problem Statement: Users struggle to find a streamlined, engaging, and reliable way to explore historical events. Current tools like Wikipedia lack interactivity and personalized exploration.
  • Target Audience: Students, history enthusiasts, and individuals looking for educational and interactive historical content.
  • Goals:
    • Build an intuitive way to search and explore historical events.
    • Provide engaging features like interactive scrolling, bookmarking, and social interactions.
  • Duration: 5 weeks
  • Role: Sole UX/UI Designer (conducted research, ideation, design, testing, and iteration).

   Research

    • Research Methods:

      • User Interviews: Conducted with 5 participants, including students and professionals.
      • Surveys: Gathered responses on how users interact with historical platforms and their pain points.
      • Competitive Analysis: Compared Wikipedia, Google search, and history apps to identify gaps.

      Key Insights:

      • Users lack engaging tools to explore historical content (Marissa: “Google is what I use for history, but it lacks interactivity”).
      • Timeline scrolling should be intuitive and interactive (Danny: “Interactive timeline is on point, but make the titles bigger”).
      • Users need shareable and bookmarkable content for better retention.
      • Participants wanted clear navigation and more visible scrolling prompts.

      Pain Points:

      1. Limited interactivity in existing history tools.
      2. Confusing navigation in static platforms.
      3. Lack of personalized or bookmarked history content.

      Personas Created:

      • Danny: A professional who wants quick, engaging access to historical data.
      • Marissa: A student exploring tools to simplify history research.
      • Anthony: A busy dad needing quick and accessible history facts for his kids.

Personas:

  • Andy: A professional who wants quick, engaging access to historical data.
  • Candice: A student exploring tools to simplify history research.

 Define

    • User Journey & Task Flows:

      • Created user flows for onboarding, timeline exploration, search, and bookmarking features.
      • Mapped pain points and actions required to improve navigation and interactivity.

      Problem to Solve:

      Create a historical exploration app that simplifies navigation, enhances engagement, and includes sharing/bookmarking capabilities.

 User Flows 

  • Created a simple flow where users input details of the recipient, and the app generates suggestions.
  • Designed a clear sitemap ensuring easy navigation across the platform.
    •  

  Design

    • Design Approach:

      • Wireframes:
        Low-fidelity wireframes mapped out the structure for the main screens: Welcome, Home, Timeline Scroll, Search, and User Profile.
      • UI Designs:
        • High-fidelity mockups with a clean and intuitive layout.
        • Final color palette: 414141 (Text), FF4932 (CTA Red), 007AFF (Accent Blue), FFFFFF (Background).

      Interactive Features:

      1. Interactive Timeline Scroll with event highlights.
      2. Search with era filters and year input.
      3. Bookmark and share options for events.
      4. User profile with favorite eras and achievements.

From Wireframe

To Prototype

Before
After

   Hight Fidelity Wireframing

Welcome
Home Page
Register
Sign In
Search & Filter
Timeline
Forum
Single Event View



   Testing

  

    • Usability Testing Plan:

      Tested the prototype with 5 participants to validate design choices and identify areas for improvement.
      Key Scenarios Tested:

      1. Exploring historical events using the timeline.
      2. Searching for specific events using filters.
      3. Navigating to the profile and bookmarking events.

      Feedback Summary:

      • Danny:
        • Liked the interactive timeline but wanted bigger titles for better readability.
        • Couldn’t share events—suggested a clear share feature.
      • Marissa:
        • Found the design intuitive but didn’t know scrolling was an option.
        • Needed prompts/icons to guide user interaction.
      • Anthony (Hypothetical):
        • Needed quick access to summarized events for busy schedules.
      • Mike (Hypothetical):
        • Requested more social features like commenting and reactions.
      • Brittany (Hypothetical):
        • Suggested a favorite events section for easier access later.

      Insights:

      1. Add scroll prompts to improve discoverability.
      2. Increase CTA button sizes for better usability.
      3. Add a share feature to encourage content sharing.
      4. Improve font size and hierarchy for better readability.



Iterations

  

    • Based on Feedback:

      1. Added a scroll icon/prompt to the timeline.
      2. Increased title sizes on the timeline and event pages.
      3. Implemented share and bookmark features for events.
      4. Adjusted the search button size and linked results to specific events.
      5. Added a drop-down to select favorite historical eras in the user profile.

Challenges and Set Backs 

 

Challenges included failing over and over attempting to simply create a scroll Bar that would control the page to move as i move the scroll bar.

      • Balancing detailed content with a clean, interactive UI.
      • Learned the importance of user prompts to guide interactions (e.g., scroll indicators).
      • Prototyping and usability testing helped refine features and improve navigation.

Over time, I realized I wasn’t the only one who struggled with history. Students I interviewed said the same thing:

  • “I would love to use an app like this in school.”
  • “I wish I had this when I was learning history—it would’ve made it so much easier and fun.”

With this encouragement and feedback, I brought the vision to life. MindLine became more than just an app—it became a tool to make history accessible, engaging, and collaborative. The goal was simple:

  1. Help users explore history effortlessly.
  2. Add the magic of social interactions to bring history alive.
  3. Open minds to new perspectives and meaningful discussions about the past.

MindLine isn’t just about learning history; it’s about connecting with it. It’s a chance to see the past through new eyes, scroll through events like never before, and make learning something truly inspiring.

Conclusion

Project Insights:

  • Challenges included failing over and over attempting to simply create a scroll Bar that would control the page to move as i move the scroll bar.
  • Balancing detailed content with a clean, interactive UI.
  • Learned the importance of user prompts to guide interactions (e.g., scroll indicators).
  • Prototyping and usability testing helped refine features and improve navigation.

Next Steps:

  1. Add videos and multimedia for historical events.
  2. Enhance social features like discussions and reactions.
  3. Test the updated prototype with a broader audience to validate changes.

Key Takeaways:

  • Users value intuitive navigation and personalized content.
  • Interactive elements like timelines improve engagement and learning.
  • Balancing user feedback with design goals leads to impactful solutions.

What I’m Proud Of: Successfully creating a functional prototype that simplifies history exploration with a clear, engaging user experience while utilizing some of the most challenging animations and tricks for graphic representation software like Figma, Uizard and Adobe Photoshop.



View Figma Layout



30 Min Case Study Coming Soon



View Prototype

Scroll to Top