Ammar Khawar | UX Engineer

Conversa

Bringing Stories to Life with AI

Conversa by StoryFile is reshaping the way we interact with stories, history, and knowledge. Using cutting-edge conversational AI and interactive video technology, Conversa allows users to connect with lifelike digital avatars that can answer questions and share experiences. Whether in museums, educational settings, or businesses, Conversa creates a personal and immersive storytelling experience like never before.

I collaborated with the StoryFile team to redesign their Conversa platform, specifically focusing on improving the Builder Tab, Transcript Tab, Tablet App for Museum, and AskApp Module. These modules enable users to create, interact, and manage digital StoryFiles with ease.

Project duration

Aug 2024 - Oct 2024

Responsibilities

User Experience Research, Wireframing, UI Design, Iterative improvements, Figma

Role

Ux Designer

PLAY VIDEO: What is Conversa?

The Problem

Visitors struggled to interact with Conversational AI effectively.

Visitors struggled to interact with the AI doubles due to a lack of on-screen guidance, while museum staff found it difficult to manage and control conversations seamlessly. Additionally, the process of setting up StoryFiles was not intuitive, leading to frustration and missed opportunities for deeper engagement.

Lack of clear on-screen instructions for visitors.

Challenges for museum staff in managing conversations.

Complex and non-intuitive StoryFile setup process.

As a remote designer, I worked closely with the onsite team to address critical issues identified in visitor interactions, staff workflows, and the StoryFile setup process. The onsite team provided feedback and insights from their observations, which became the foundation of my design solutions.

As a remote designer,
I worked closely with the onsite team to address critical issues identified in visitor interactions, staff workflows, and the StoryFile setup process. The onsite team provided feedback and insights from their observations, which became the foundation of my design solutions.

The Process

Here’s what i did!

Identifying Problem

Remote collaboration to identify key challenges with the Conversa system.

Feedback Analysis

Leveraged insights from the onsite team to understand visitor and staff struggles.

UI/UX Research

Analyzed existing designs to pinpoint usability gaps.

Prototype Creation

Designed wireframes addressing pain points.

Iteration & Feedback

Integrated feedback from the team and stakeholders.

Final Implementation

Delivered refined, user-focused designs for deployment.

Working Within Constraints

Designing for Conversa presented a unique challenge!

We had to adhere to an established design system, including predefined fonts, colors, and overall aesthetic guidelines. This meant no flexibility in creating new design elements or overhauling the visual style. Instead, we focused on enhancing the user experience within the existing framework, ensuring consistency and maintaining the platform's identity while introducing valuable new functionalities.

Product Gallery

Improving Visitor Experience

This involves enhancing how visitors or users interact with the Conversational AI or AI double. The goal is to make these interactions more engaging, intuitive, and meaningful, ensuring that users can easily navigate and communicate with the AI without confusion.

Old Version

Challenges Identified:

Visitors struggled to engage with AI doubles due to unclear on-screen guidance.

Lack of structured prompts led to visitor disengagement.

Improved Version

Solutions that i came up with!

Introduced On-Screen ‘Hints’ feature to Guide Visitors with Available Topics and Questions.

Added a dedicated 'Follow-Up Questions' Button to provide Visitors with Contextual Next Steps, enhancing Engagement and Maintaining the Flow of Conversation.

Improved Overall On-Screen Guidance by Integrating ‘Dynamic Subtitles’, a Clear ‘Hints System’, and ‘Follow-Up Question’ Prompts to Reduce Confusion and Streamline the Visitor's Experience.

Streamlining Museum Operations

This focuses on optimizing tools and processes for museum staff & vistors to effectively manage AI interactions. It’s about making it easier for users to control and monitor conversations while delivering a seamless experience to visitors.

Old Version

Challenges Identified:

Staff struggled to handle real-time visitor interactions effectively due to the lack of clear operational controls and guidance on the tablet interface.

Staff had no streamlined way to influence or guide AI responses during conversations, leading to inefficiencies in addressing visitor needs.

Too Much White Space.

Improved Version

Solutions that i came up with!

A Cleaner and Organized Layout that makes it easier for people to navigate and manage AI interactions efficiently.

"Play Intro Video" button to Play an Introductory video about the Person.

A Language Toggle to Cater to a Diverse Audience and Improve Accessibility.

Addition of "Follow-Up Questions" Button to Display Conversation Options, enabling Users to engage with the AI seamlessly.

Simplifying StoryFile Setup

This is about making the process of creating and organizing StoryFiles simpler. It ensures users can easily preview, manage, and build their StoryFiles without feeling overwhelmed, leading to a smoother and more efficient setup process.

Users were unable to preview AI-generated topics or questions before adding them to the StoryFile script. This often led to unnecessary or irrelevant questions being included, causing inefficiencies in the setup process and extra work for users to curate the final script.

Users lacked options to manage transcripts in multiple languages.

The absence of editing tools made managing transcripts cumbersome.

Improved Version

Solutions that i came up with!

Added a new step to preview topics and questions and Introduced a guided, step-by-step flow for StoryFile setup.

Introduced a “preview feature” that allows users to review AI-generated topics and questions before adding them to their StoryFile script. This ensures that users can selectively include only the most relevant and meaningful content, streamlining the setup process and enhancing customization.

Introduced an “Upload Transcript” functionality so users can upload transcript manually and in any language.

Included tools for editing transcripts, such as breaking down content into sentences.

Integrated a “timeline view” for navigating transcripts with ease.

Added support for managing multiple languages, allowing users to “upload” and “select” different language options.

REFLECTION

Insights from Designing for Conversa

Collaborating remotely with a dynamic team allowed me to learn the nuances of designing for diverse user groups—from museum visitors to administrative staff.

Adding even seemingly simple features, such as previewing AI-generated questions, can profoundly enhance the user experience and efficiency of the platform. These improvements taught me to value user testing and iterative design processes.

User-Centric Design is Key

Every design decision must prioritize usability. Features like hints, previews, and follow-up questions significantly improved engagement for both visitors and staff.

Collaboration Drives Innovation

Although working remotely, effective communication with stakeholders played a vital role in identifying user pain points and implementing meaningful solutions.

Iterate to Innovate

The process of redesigning and testing features emphasized that the best designs emerge from multiple iterations and consistent user feedback.