FunkyCritters app

FunkyCritters app

FunkyCritters App

FunkyCritters App

Where Comics Come Alive in Color!

Where Comics Come Alive in Color!

Diamond AI – Conversational AI Concept

Diamond AI – Conversational AI Concept

Overview

This section provides a high-level summary of the chatbot interface design. It outlines the purpose of the UI, its target users, and the core functionalities such as prompt input, AI-generated content output, and user interactions.

Overview

This section provides a high-level summary of the chatbot interface design. It outlines the purpose of the UI, its target users, and the core functionalities such as prompt input, AI-generated content output, and user interactions.

Intro

Intro

By combining a welcoming tone, smart defaults like common prompt cards, and essential features like history tracking and profile management, the interface guides users of all levels—beginners to power users—through a seamless AI-assisted experience.

By combining a welcoming tone, smart defaults like common prompt cards, and essential features like history tracking and profile management, the interface guides users of all levels—beginners to power users—through a seamless AI-assisted experience.

Home Page – Welcome, Navigation & Discovery

Home Page – Welcome, Navigation & Discovery

The main entry point for FunkyCritters, this home screen welcomes users, highlights trending comics, and shows recently played content.

The main entry point for FunkyCritters, this home screen welcomes users, highlights trending comics, and shows recently played content.

Design Highligh :

Design Highligh :

— Personal Greeting: Builds a sense of connection with the user ("Hi Elen").

— Search & Notifications: Top-right icons for fast interaction.

Sectioned Layout:

— Trending Books: Scrollable card layout for discovery.

— Recently Played: Easy access to ongoing reads/listens.

— Mini Audio Player (Bottom Bar): Persistent and accessible player for multitasking.


— Personal Greeting: Builds a sense of connection with the user ("Hi Elen").

— Search & Notifications: Top-right icons for fast interaction.

Sectioned Layout:

— Trending Books: Scrollable card layout for discovery.

— Recently Played: Easy access to ongoing reads/listens.

— Mini Audio Player (Bottom Bar): Persistent and accessible player for multitasking.


Use case : Used when launching the app or returning from another tab. It encourages discovery and continuation, helping users stay engaged with vibrant comic stories.

Use case : Used when launching the app or returning from another tab. It encourages discovery and continuation, helping users stay engaged with vibrant comic stories.

Story Overview & Playback Control

Story Overview & Playback Control

This screen provides an overview of a specific comic or audiobook — in this case, The Adventures of Blorp & Fizzle by Finn Flobble.

This screen provides an overview of a specific comic or audiobook — in this case, The Adventures of Blorp & Fizzle by Finn Flobble.

Design Highligh :

Design Highligh :

— Cover Art + Book Info: Bold, colorful visuals attract users and give personality to the comic.

— Author & Duration: Simple metadata layout for context.

— Playback Bar: Enables progress tracking and quick resume.

— Text Introduction: Scrollable synopsis introduces users to the universe and characters.

— Play Button: Centrally located for quick access to listen mode.

— Cover Art + Book Info: Bold, colorful visuals attract users and give personality to the comic.

— Author & Duration: Simple metadata layout for context.

— Playback Bar: Enables progress tracking and quick resume.

— Text Introduction: Scrollable synopsis introduces users to the universe and characters.

— Play Button: Centrally located for quick access to listen mode.

Use case : A user taps on a comic from the home or library to learn more about it, preview the synopsis, and start listening/reading from the beginning or where they left off.

Use case : A user taps on a comic from the home or library to learn more about it, preview the synopsis, and start listening/reading from the beginning or where they left off.

Description :

Description

READING Page – Immersive Experience & Deep Dive

Description :

An immersive reading/listening screen showing extended text, media, and playback controls for the comic.

An immersive reading/listening screen showing extended text, media, and playback controls for the comic.

READING Page – Immersive Experience & Deep Dive

Use case : Ideal for users engaged in an active reading or listening session. The focus here is on uninterrupted storytelling with optional controls to manage pacing or replay favorite parts.

Use case : Ideal for users engaged in an active reading or listening session. The focus here is on uninterrupted storytelling with optional controls to manage pacing or replay favorite parts.

Design Highligh :

Design Highligh

Design Highligh :

— Chapter Header: Clean title bar with a heart icon for favorites.

— Rich Text Content: Large readable font for kids and comic fans.

— Visual Insert: Inline image enhances storytelling and breaks up the text visually.

— Playback Controls: Jump back/forward, pause/play, and timeline scrubber for easy audio navigation.

— Chapter Header: Clean title bar with a heart icon for favorites.

— Rich Text Content: Large readable font for kids and comic fans.

— Visual Insert: Inline image enhances storytelling and breaks up the text visually.

— Playback Controls: Jump back/forward, pause/play, and timeline scrubber for easy audio navigation.

Design Summary & User Experience Vision

Design Summary & User Experience Vision

FunkyCritters features a bold, colorful, and playful design tailored for comic lovers of all ages. The UI embraces a whimsical aesthetic with vibrant illustrations, rounded elements, and plenty of personality. It balances fun with function — offering intuitive navigation, immersive reading/listening experiences, and a strong sense of character throughout.

FunkyCritters features a bold, colorful, and playful design tailored for comic lovers of all ages. The UI embraces a whimsical aesthetic with vibrant illustrations, rounded elements, and plenty of personality. It balances fun with function — offering intuitive navigation, immersive reading/listening experiences, and a strong sense of character throughout.

The design prioritizes:


— User immersion, using full-screen visuals and audio-enhanced storytelling.

— Accessibility and clarity, with large readable fonts, soft contrast backgrounds, and clear CTAs.

— Personalization, with sections like Recently Played and Trending Books.

— Consistency, through a cohesive visual language: rounded cards, pastel colors, and fun iconography.

The design prioritizes:


— User immersion, using full-screen visuals and audio-enhanced storytelling.

— Accessibility and clarity, with large readable fonts, soft contrast backgrounds, and clear CTAs.

— Personalization, with sections like Recently Played and Trending Books.

— Consistency, through a cohesive visual language: rounded cards, pastel colors, and fun iconography.

From onboarding to reading, every screen feels like a page from a living comic book — bursting with color, creativity, and interactivity.

From onboarding to reading, every screen feels like a page from a living comic book — bursting with color, creativity, and interactivity.

Open for work.

Reach out if you're looking for a product designer.

Contact me

Social media

Location

Casablanca, Morocco

legal

Open for work.

Reach out if you're looking for a product designer.

Contact me

Social media

Location

Casablanca, Morocco

legal

Open for work.

Reach out if you're looking for a Software Designer.

Contact me

or through my social media

Social media

Location

Casablanca, Morocco

legal