Natif

Transforming Internal Knowledge Sharing with Intuitive Design

Mission

As the UI Designer on this project, my mission was to create the UI on Figma to create an engaging and intuitive user interface for Natif, a mobile podcasting platform for corporate learning. By balancing simplicity and functionality, I aimed to deliver an optimal user experience for both content creators and listeners. Leveraging design principles and competitive insights, I conceptualized and developed high-fidelity prototypes, ensuring a cohesive and modern visual direction throughout the application.

Team structure

1 UX Designer & 1 UI Designer (me)

Research methods

Product design sprint, lean business model canvas, Ideation (co-creative workshop), user testing

My role

UI design, visual design, Co-host workshop

Plateform

Mobile Application (iOS/Android)

Time Frame

Complete in 4 months 2022-2023

Design tools

Figma, Paper, Whimsical

UI design

Design sprint

High fidelity

Co-host workshop

Co-host workshop

Advance prototype

User testing

Overview

Natif is a mobile podcasting platform designed for companies to provide internal training and inspiration through employee created content. Employees can record, share, and listen to audio content, fostering knowledge sharing and strengthening corporate culture.

The project aimed to design an intuitive mobile application that facilitates content creation and consumption, ensuring a seamless user experience.

Objectives

Build a scalable platform for recording, publishing, and listening to podcasts within companies.

Build a scalable platform for recording, publishing, and listening to podcasts within companies.

Build a scalable platform for recording, publishing, and listening to podcasts within companies.

Design a user-friendly UI that balances simplicity and efficiency for both content creators and listeners.

Design a user-friendly UI that balances simplicity and efficiency for both content creators and listeners.

Design a user-friendly UI that balances simplicity and efficiency for both content creators and listeners.

Encourage employee engagement and knowledge sharing through clear navigation and visually appealing interactions.

Encourage employee engagement and knowledge sharing through clear navigation and visually appealing interactions.

Encourage employee engagement and knowledge sharing through clear navigation and visually appealing interactions.

Strategic Value

01

Enable easy access to valuable content.

Promote a culture of learning

01

Enable easy access to valuable content.

Promote a culture of learning

01

Enable easy access to valuable content.

Promote a culture of learning

02

Provide tools for anyone to create and share audio content.

Empower employees

02

Provide tools for anyone to create and share audio content.

Empower employees

02

Provide tools for anyone to create and share audio content.

Empower employees

03

Strengthen the sense of belonging by sharing knowledge internally.

Enhance company identity

03

Strengthen the sense of belonging by sharing knowledge internally.

Enhance company identity

03

Strengthen the sense of belonging by sharing knowledge internally.

Enhance company identity

Outcomes

01

Natif provided a scalable solution for delivering on-demand training and inspiring content, facilitating continuous learning in a flexible format tailored to employees’ needs.

Boosted Corporate Learning Culture

01

Natif provided a scalable solution for delivering on-demand training and inspiring content, facilitating continuous learning in a flexible format tailored to employees’ needs.

Boosted Corporate Learning Culture

01

Natif provided a scalable solution for delivering on-demand training and inspiring content, facilitating continuous learning in a flexible format tailored to employees’ needs.

Boosted Corporate Learning Culture

02

The platform allowed companies to centralize and democratize content creation, enabling employees to share expertise, updates, and training materials efficiently.

Enhanced Internal Knowledge Sharing

02

The platform allowed companies to centralize and democratize content creation, enabling employees to share expertise, updates, and training materials efficiently.

Enhanced Internal Knowledge Sharing

02

The platform allowed companies to centralize and democratize content creation, enabling employees to share expertise, updates, and training materials efficiently.

Enhanced Internal Knowledge Sharing

03

A well-designed interface ensured that users, regardless of technical proficiency, could navigate, access, and engage with content quickly, improving overall productivity.

Clear and Efficient Navigation

03

A well-designed interface ensured that users, regardless of technical proficiency, could navigate, access, and engage with content quickly, improving overall productivity.

Clear and Efficient Navigation

03

A well-designed interface ensured that users, regardless of technical proficiency, could navigate, access, and engage with content quickly, improving overall productivity.

Clear and Efficient Navigation

Results

The challenge (UI)

The project, focusing on how we addressed the needs of two distinct user types : content creators and listeners. It also explores the critical balance between functionality and simplicity, maintaining visual consistency across different states.

01

Multiple User Profiles

The app needed to cater to two user types:

- Content Creators: Users recording and publishing podcasts.

- Listeners: Employees accessing and consuming content effortlessly.

02

Designing a visually clear UI while integrating advanced features like recording tools, publishing options, and content organization.

Balancing Simplicity and Functionality

02

Designing a visually clear UI while integrating advanced features like recording tools, publishing options, and content organization.

Balancing Simplicity and Functionality

02

Designing a visually clear UI while integrating advanced features like recording tools, publishing options, and content organization.

Balancing Simplicity and Functionality

03

Ensuring a cohesive design system to handle various states (recording, editing, listening) while maintaining a clean and accessible interface.

Design Consistency

03

Ensuring a cohesive design system to handle various states (recording, editing, listening) while maintaining a clean and accessible interface.

Design Consistency

03

Ensuring a cohesive design system to handle various states (recording, editing, listening) while maintaining a clean and accessible interface.

Design Consistency

04

Aligning the visual style with professional environments while keeping the app engaging and modern.

Corporate Context

04

Aligning the visual style with professional environments while keeping the app engaging and modern.

Corporate Context

04

Aligning the visual style with professional environments while keeping the app engaging and modern.

Corporate Context

Exemple balance between multiple user profil

Research

Although the project focus was on UI design, initial research was conducted to validate the concept and gather insights:

Workshop 1

Study of existing podcast platforms (Spotify, Anchor, Audible) to identify successful patterns in audio playback, content discovery, and recording flows.

Competitive Analysis

Study of existing podcast platforms (Spotify, Anchor, Audible) to identify successful patterns in audio playback, content discovery, and recording flows.

Competitive Analysis

Study of existing podcast platforms (Spotify, Anchor, Audible) to identify successful patterns in audio playback, content discovery, and recording flows.

Competitive Analysis

Workshop 2 + Delivrable

Two key personas were defined

User Personas

Two key personas were defined

User Personas

Two key personas were defined

User Personas

The Creator: Wants intuitive tools to record and publish quickly

The Creator: Wants intuitive tools to record and publish quickly

The Creator: Wants intuitive tools to record and publish quickly

The Listener: Needs clear navigation and easy access to relevant content.

The Listener: Needs clear navigation and easy access to relevant content.

The Listener: Needs clear navigation and easy access to relevant content.

Workshop 3

We drew inspiration from dark-themed apps, prioritizing readability, accessibility, and immersive experiences.

Design Inspiration

We drew inspiration from dark-themed apps, prioritizing readability, accessibility, and immersive experiences.

Design Inspiration

We drew inspiration from dark-themed apps, prioritizing readability, accessibility, and immersive experiences.

Design Inspiration

UI & Key features

The heart of my mission was to focus on the user interface design, structured to create a seamless, engaging, and professional experience.

1. Login & Onboarding Flow

The onboarding flow introduces users to the app’s core features and encourages immediate engagement

Clean, dark-themed design for an immersive experience.

Clean, dark-themed design for an immersive experience.

Clean, dark-themed design for an immersive experience.

Highlights features such as recording tools, collaborative content, and content discovery.

Highlights features such as recording tools, collaborative content, and content discovery.

Highlights features such as recording tools, collaborative content, and content discovery.

Simple login process to ensure quick access.

Simple login process to ensure quick access.

Simple login process to ensure quick access.

2. Homepage & Content Discovery

The homepage was designed for effortless content navigation

Highlight key podcasts, new episodes, and recommendations.

Content Cards

Highlight key podcasts, new episodes, and recommendations.

Content Cards

Highlight key podcasts, new episodes, and recommendations.

Content Cards

Allow users to browse by themes (training, inspiration, team updates).

Filters & Categories

Allow users to browse by themes (training, inspiration, team updates).

Filters & Categories

Allow users to browse by themes (training, inspiration, team updates).

Filters & Categories

Integration of a “Continue Listening” feature for user convenience.

Integration of a “Continue Listening” feature for user convenience.

Integration of a “Continue Listening” feature for user convenience.

3. Recording Flow

One of the most critical parts of the app was the recording flow for creators

Intuitive screens guide the user through each step (record, listen, re-record, publish).

Step-by-Step Recording Process

Intuitive screens guide the user through each step (record, listen, re-record, publish).

Step-by-Step Recording Process

Intuitive screens guide the user through each step (record, listen, re-record, publish).

Step-by-Step Recording Process

Sound waves provide real-time feedback during recording.

Visual Feedback

Sound waves provide real-time feedback during recording.

Visual Feedback

Sound waves provide real-time feedback during recording.

Visual Feedback

Clear prompts for recording issues or incomplete actions.

Error Handling

Clear prompts for recording issues or incomplete actions.

Error Handling

Clear prompts for recording issues or incomplete actions.

Error Handling

4. Content Playback & Podcast Details

To ensure an engaging listening experience, the playback design focused on simplicity

Inspired by modern audio platforms, with playback controls and progress tracking.

Player Interface

Inspired by modern audio platforms, with playback controls and progress tracking.

Player Interface

Inspired by modern audio platforms, with playback controls and progress tracking.

Player Interface

Display details such as episode description, duration, and related content.

Content Information

Display details such as episode description, duration, and related content.

Content Information

Display details such as episode description, duration, and related content.

Content Information

Options to favorite, share, or download podcasts for offline listening.

Interactions

Options to favorite, share, or download podcasts for offline listening.

Interactions

Options to favorite, share, or download podcasts for offline listening.

Interactions

5. Profile & Customization

The profile section allows users to manage their content and preferences

Manage published episodes, drafts, and statistics.

Creator Profile

Manage published episodes, drafts, and statistics.

Creator Profile

Manage published episodes, drafts, and statistics.

Creator Profile

Favorites, downloaded content, and personalized settings.

Listener Profile

Favorites, downloaded content, and personalized settings.

Listener Profile

Favorites, downloaded content, and personalized settings.

Listener Profile

Insights & Results

Each design choice was made to enhance usability and engagement

Insights

Give the feeling of an application that they can use at any time even outside of work.

Dark Theme for Immersion

Give the feeling of an application that they can use at any time even outside of work.

Dark Theme for Immersion

Give the feeling of an application that they can use at any time even outside of work.

Dark Theme for Immersion

Insight :

A dark theme was chosen to enhance readability during extended listening sessions and provide a modern, premium look.

Insight :

A dark theme was chosen to enhance readability during extended listening sessions and provide a modern, premium look.

Insight :

A dark theme was chosen to enhance readability during extended listening sessions and provide a modern, premium look.

Insight :

Inspiration came from platforms like Spotify and Audible.

Insight :

Inspiration came from platforms like Spotify and Audible.

Insight :

Inspiration came from platforms like Spotify and Audible.

For an MVP give less choice to improve their usability.

Clear Navigation & Hierarchy

For an MVP give less choice to improve their usability.

Clear Navigation & Hierarchy

For an MVP give less choice to improve their usability.

Clear Navigation & Hierarchy

Insight :

The app’s navigation was simplified without a bottom tab bar, ensuring quick access when the track is on live.

Insight :

The app’s navigation was simplified without a bottom tab bar, ensuring quick access when the track is on live.

Insight :

The app’s navigation was simplified without a bottom tab bar, ensuring quick access when the track is on live.

Guiding the user helps avoid errors. This is the most important thing in an application.

Error Prevention for Creators

Guiding the user helps avoid errors. This is the most important thing in an application.

Error Prevention for Creators

Guiding the user helps avoid errors. This is the most important thing in an application.

Error Prevention for Creators

Insight :

Step-by-step prompts and error handling (e.g., re-record options) ensure that content creation remains frustration-free.

Insight :

Step-by-step prompts and error handling (e.g., re-record options) ensure that content creation remains frustration-free.

Insight :

Step-by-step prompts and error handling (e.g., re-record options) ensure that content creation remains frustration-free.

Testimonials

“The recording process is incredibly simple, even for someone like me with no prior experience in audio.”

“The recording process is incredibly simple, even for someone like me with no prior experience in audio.”

“The recording process is incredibly simple, even for someone like me with no prior experience in audio.”

- HR Manager -

“I love how easy it is to find relevant content—everything feels tailored to my needs.”

“I love how easy it is to find relevant content—everything feels tailored to my needs.”

“I love how easy it is to find relevant content—everything feels tailored to my needs.”

- Corporate Employee -

My Learnings

This project highlighted several key lessons

Balancing Complexity and Simplicity

01

Balancing Complexity and Simplicity

01

Balancing Complexity and Simplicity

01

Prioritizing essential features in the recording flow made the app both powerful and user-friendly.

Design Systems Matter

02

Design Systems Matter

02

Design Systems Matter

02

Creating a consistent design system ensured seamless transitions between states (recording, listening, browsing).

User-Centric Visuals

03

User-Centric Visuals

03

User-Centric Visuals

03

Leveraging real-time feedback (sound waves) and clean UI elements enhanced both usability and user trust.

Immersion Through Visual Design

04

Immersion Through Visual Design

04

Immersion Through Visual Design

04

Thoughtful use of dark themes and micro-interactions contributed to a premium experience.