Unpredictable: The Walk In and Out of Darkness

UX/UI Design

Figma Prototyping

Visual Identity

Project Year

2024

Client

Honey Kasper / Independent Author

Industry

Publishing & Digital Media

Web Experience

My journey with “The Unpredictable Walk in Darkness” wasn’t just about redesigning a website; it was about crafting an immersive digital gateway
to a world of childhood fears and fantastical encounters. Honey Kasper’s book is a dark fantasy tale, exploring themes of loss, resilience, and the often-unsettling landscapes of a child’s imagination.

However, the original website felt disconnected, failing to capture the book’s haunting beauty
and resonate with potential readers drawn to its unique blend of innocence and darkness.

Brand Identity:

Visualizing Hope & Resilience

In addition to the website’s overall design, I also developed a logo to encapsulate the book’s core message:
From Darkness to Triumph: A tale of Faith and Resilience. This logo was designed to be both impactful and
easily recognizable.
Honey Kasper’s story is a testament to the strength of the human spirit. This logo isn’t just a design; it’s a
visual embodiment of her journey, intended to instantly communicate the core message of the book: that
even in the darkest of times, triumph is possible through faith and resilience. My goal was to create a logo that
was both powerful and easily recognizable, serving as a constant reminder of this message.
Every element of the logo was carefully considered to convey the desired meaning:

  • The Phrase Itself: “FROM DARKNESS TO TRIUMPH: A Tale of Faith and Resilience” is not just a tagline; it’s
    the foundation. It’s deliberately included to immediately convey the book’s narrative.
  • The Hierarchy: Note the emphasis on “TRIUMPH.” By making it the largest word, it’s the írst thing the eye
    is drawn to, reinforcing the message of hope and victory.
  • The Color Palette: The combination of light gold and black is intentional. The gold symbolizes hope,
    achievement, and the “light” at the end of the tunnel. The black represents the initial struggles, hardships,
    and moments of darkness that must be overcome. The gold outline subtly highlights the letters from the
    black background
    The Font: I chose a bold, sans-serif font for its strength, clarity, and modern appeal. It needed to be
    something solid and unwavering to mirror the strength of the author’s spirit.
  • Balance: The dark outline on the letters create a balanced look to the logo, highlighting them,

Brand Identity:

Visualizing Hope & Resilience

In addition to the website’s overall design, I also developed a logo to encapsulate the book’s core message:
From Darkness to Triumph: A tale of Faith and Resilience. This logo was designed to be both impactful and
easily recognizable.
Honey Kasper’s story is a testament to the strength of the human spirit. This logo isn’t just a design; it’s a
visual embodiment of her journey, intended to instantly communicate the core message of the book: that
even in the darkest of times, triumph is possible through faith and resilience. My goal was to create a logo that
was both powerful and easily recognizable, serving as a constant reminder of this message.
Every element of the logo was carefully considered to convey the desired meaning:

  • The Phrase Itself: “FROM DARKNESS TO TRIUMPH: A Tale of Faith and Resilience” is not just a tagline; it’s
    the foundation. It’s deliberately included to immediately convey the book’s narrative.
  • The Hierarchy: Note the emphasis on “TRIUMPH.” By making it the largest word, it’s the írst thing the eye
    is drawn to, reinforcing the message of hope and victory.
  • The Color Palette: The combination of light gold and black is intentional. The gold symbolizes hope,
    achievement, and the “light” at the end of the tunnel. The black represents the initial struggles, hardships,
    and moments of darkness that must be overcome. The gold outline subtly highlights the letters from the
    black background
    The Font: I chose a bold, sans-serif font for its strength, clarity, and modern appeal. It needed to be
    something solid and unwavering to mirror the strength of the author’s spirit.
  • Balance: The dark outline on the letters create a balanced look to the logo, highlighting them,

Brand Identity:

Visualizing Hope & Resilience

In addition to the website’s overall design, I also developed a logo to encapsulate the book’s core message:
From Darkness to Triumph: A tale of Faith and Resilience. This logo was designed to be both impactful and
easily recognizable.
Honey Kasper’s story is a testament to the strength of the human spirit. This logo isn’t just a design; it’s a
visual embodiment of her journey, intended to instantly communicate the core message of the book: that
even in the darkest of times, triumph is possible through faith and resilience. My goal was to create a logo that
was both powerful and easily recognizable, serving as a constant reminder of this message.
Every element of the logo was carefully considered to convey the desired meaning:

  • The Phrase Itself: “FROM DARKNESS TO TRIUMPH: A Tale of Faith and Resilience” is not just a tagline; it’s
    the foundation. It’s deliberately included to immediately convey the book’s narrative.
  • The Hierarchy: Note the emphasis on “TRIUMPH.” By making it the largest word, it’s the írst thing the eye
    is drawn to, reinforcing the message of hope and victory.
  • The Color Palette: The combination of light gold and black is intentional. The gold symbolizes hope,
    achievement, and the “light” at the end of the tunnel. The black represents the initial struggles, hardships,
    and moments of darkness that must be overcome. The gold outline subtly highlights the letters from the
    black background
    The Font: I chose a bold, sans-serif font for its strength, clarity, and modern appeal. It needed to be
    something solid and unwavering to mirror the strength of the author’s spirit.
  • Balance: The dark outline on the letters create a balanced look to the logo, highlighting them,

The Challenge:

Bridging The Gap Between Page And Reader

The original website for Honey Kasper’s book lacked visual intrigue and failed to convey the unique atmosphere of “Unpredictable: The Walk In and Out of Darkness.”

My goal was to capture a sense of calm preparedness. I imagined a visual that radiated inner peace, resilience, and softness — a design that would resonate with women reclaiming their postpartum experience as something beautiful and powerful.

I turned to Midjourney, an AI image-generation tool, to help explore visual directions that aligned with the emotional tone. Using a carefully engineered set of prompts, I guided the AI to produce imagery with muted tones, delicate floral details, and a peaceful, introspective mood.

But AI alone doesn’t create meaning — it creates raw visual potential. That’s where my skills as a graphic designer came in.

The Challenge:

Bridging The Gap Between Page And Reader

The original website for Honey Kasper’s book lacked visual intrigue and failed to convey the unique atmosphere of “Unpredictable: The Walk In and Out of Darkness.”

My goal was to capture a sense of calm preparedness. I imagined a visual that radiated inner peace, resilience, and softness — a design that would resonate with women reclaiming their postpartum experience as something beautiful and powerful.

I turned to Midjourney, an AI image-generation tool, to help explore visual directions that aligned with the emotional tone. Using a carefully engineered set of prompts, I guided the AI to produce imagery with muted tones, delicate floral details, and a peaceful, introspective mood.

But AI alone doesn’t create meaning — it creates raw visual potential. That’s where my skills as a graphic designer came in.

The Challenge:

Bridging The Gap Between Page And Reader

The original website for Honey Kasper’s book lacked visual intrigue and failed to convey the unique atmosphere of “Unpredictable: The Walk In and Out of Darkness.”

My goal was to capture a sense of calm preparedness. I imagined a visual that radiated inner peace, resilience, and softness — a design that would resonate with women reclaiming their postpartum experience as something beautiful and powerful.

I turned to Midjourney, an AI image-generation tool, to help explore visual directions that aligned with the emotional tone. Using a carefully engineered set of prompts, I guided the AI to produce imagery with muted tones, delicate floral details, and a peaceful, introspective mood.

But AI alone doesn’t create meaning — it creates raw visual potential. That’s where my skills as a graphic designer came in.

Mood Board

Key Points

This mood board guided the design of “Unpredictable: The Walk In and Out of Darkness,” ensuring the website reîected the book’s powerful themes of triumph, faith, and resilience through a cohesive and emotionally resonant visual language. Leonardo AI was used extensively
to create bespoke images that perfectly captured the book’s unique
atmosphere.

  • Core Message: Encapsulate the story’s journey from darkness to triumph.
  • Palette: A blend of dark olive, gold, and gray reîects struggles and hope.
  • Imagery (Leonardo AI): Images of hope, struggle, and faith were customgenerated
    using Leonardo AI to create unique, thematic visuals.
  • Fonts: Oswald (headings) and Source Sans Pro (body) ensure readability and visual impact.
  • Overall Goal: To create an inspiring and deeply engaging digital experience reîecting the book’s core message.
This mood board guided the design of “Unpredictable: The Walk In and Out of Darkness,” ensuring the website reîected the book’s powerful themes of triumph, faith, and resilience through a cohesive and emotionally resonant visual language. Leonardo AI was used extensively to create bespoke images that perfectly captured the book’s unique atmosphere.
  • Core Message: Encapsulate the story’s journey from darkness to triumph.
  • Palette: A blend of dark olive, gold, and gray reîects struggles and hope.
  • Imagery (Leonardo AI): Images of hope, struggle, and faith were customgenerated using Leonardo AI to create unique, thematic visuals.
  • Fonts: Oswald (headings) and Source Sans Pro (body) ensure readability and visual impact.
  • Overall Goal: To create an inspiring and deeply engaging digital experience reîecting the book’s core message.

User Research & Personas

I began by analyzing the intended audience—adult readers drawn to dark fantasy and themes of resilience. A competitive audit of successful book websites revealed what works: strong brand identity, emotional resonance, and intuitive navigation. Key user personas were created, such as “The Heartfelt Reader” and “The Curious Blogger,” ensuring every design decision was rooted in genuine user needs and expectations.

I began by analyzing the intended audience—adult readers drawn to dark fantasy and themes of resilience. A competitive audit of successful book websites revealed what works: strong brand identity, emotional resonance, and intuitive navigation. Key user personas were created, such as “The Heartfelt Reader” and “The Curious Blogger,” ensuring every design decision was rooted in genuine user needs and expectations.

UX/UI Designer & Developer

My responsibilities spanned the entire design process,
including:

  • UX/UI Design: Creating a user-friendly and intuitive website experience that guided visitors through the
    book’s story and message. This involved developing
    wireframes, prototypes, and user îows to ensure
    seamless navigation and engagement.
  • Visual Design: Developing a cohesive and emotionally
    resonant visual identity for the website, including the
    selection of colors, typography, and imagery that aligned
    with the book’s themes.
  • Graphic Design: Designing the “From Darkness to
    Triumph” logo, a central element of the brand identity,
    and creating other supporting graphics for the website.
  • AI-Powered Visuals: Leveraging Leonardo AI to generate
    unique and thematic images that brought the book’s
    world to life in a visually compelling way.
  • Website Development: Implementing the design using
    Elementor on WordPress, ensuring a responsive and
    functional website.

UX/UI Designer & Developer

My responsibilities spanned the entire design process,
including:

  • UX/UI Design: Creating a user-friendly and intuitive website experience that guided visitors through the
    book’s story and message. This involved developing
    wireframes, prototypes, and user îows to ensure
    seamless navigation and engagement.
  • Visual Design: Developing a cohesive and emotionally
    resonant visual identity for the website, including the
    selection of colors, typography, and imagery that aligned
    with the book’s themes.
  • Graphic Design: Designing the “From Darkness to
    Triumph” logo, a central element of the brand identity,
    and creating other supporting graphics for the website.
  • AI-Powered Visuals: Leveraging Leonardo AI to generate
    unique and thematic images that brought the book’s
    world to life in a visually compelling way.
  • Website Development: Implementing the design using
    Elementor on WordPress, ensuring a responsive and
    functional website.

Tools Used

My responsibilities spanned the entire design process,
including:

  • UX/UI Design: Creating a user-friendly and intuitive website experience that guided visitors through the book’s story and message. This involved developing
    wireframes, prototypes, and user îows to ensure
    seamless navigation and engagement.
  • Visual Design: Developing a cohesive and emotionally
    resonant visual identity for the website, including the
    selection of colors, typography, and imagery that aligned
    with the book’s themes.
  • Graphic Design: Designing the “From Darkness to
    Triumph” logo, a central element of the brand identity,
    and creating other supporting graphics for the website.
  • AI-Powered Visuals: Leveraging Leonardo AI to generate
    unique and thematic images that brought the book’s
    world to life in a visually compelling way.
  • Website Development: Implementing the design using
    Elementor on WordPress, ensuring a responsive and
    functional website.

UX/UI Designer & Developer

My responsibilities spanned the entire design process, including:
  • UX/UI Design: Creating a user-friendly and intuitive website experience that guided visitors through the book’s story and message. This involved developing wireframes, prototypes, and user îows to ensure seamless navigation and engagement.
  • Visual Design: Developing a cohesive and emotionally resonant visual identity for the website, including the selection of colors, typography, and imagery that aligned with the book’s themes.
  • Graphic Design: Designing the “From Darkness to Triumph” logo, a central element of the brand identity, and creating other supporting graphics for the website.
  • AI-Powered Visuals: Leveraging Leonardo AI to generate unique and thematic images that brought the book’s world to life in a visually compelling way.
  • Website Development: Implementing the design using Elementor on WordPress, ensuring a responsive and functional website.

Tools Used

My responsibilities spanned the entire design process, including:

  • UX/UI Design: Creating a user-friendly and intuitive website experience that guided visitors through the book’s story and message. This involved developing wireframes, prototypes, and user îows to ensure seamless navigation and engagement.
  • Visual Design: Developing a cohesive and emotionally resonant visual identity for the website, including the selection of colors, typography, and imagery that aligned with the book’s themes.
  • Graphic Design: Designing the “From Darkness to Triumph” logo, a central element of the brand identity, and creating other supporting graphics for the website.
  • AI-Powered Visuals: Leveraging Leonardo AI to generate unique and thematic images that brought the book’s world to life in a visually compelling way.
  • Website Development: Implementing the design using Elementor on WordPress, ensuring a responsive and functional website.

Low-Fidelity Wireframes

Site structure was simplified to reduce friction:
Home, About, Book Details, Reviews, and Contact served distinct functions. Wireframes and prototypes (built with Figma) focused on guiding users seamlessly through story highlights and toward engagement.
Every section was positioned for accessibility and logical progression, minimizing cognitive overload.

High-Fidelity Wireframes

Final Outcome & Impact

The redesigned “Unpredictable: The Walk In and Out of Darkness” website represents a significant digital transformation, evolving from a basic online presence into a captivating and user-centered experience that effectively communicates the book’s message of hope, resilience, and triumph over adversity.
The primary goals of the project were successfully achieved:

  • Enhanced Visual Appeal: The website now boasts a visually stunning design that perfectly captures the book’s unique atmosphere, thanks to the strategic use of color, typography, and Leonardo AI-generated imagery.
  • Improved User Experience: The simplified navigation and information architecture make it easy for visitors to find key information and engage with the book.
  • Stronger Brand Identity: The consistent use of the “From Darkness to Triumph” logo and other visual elements creates a cohesive brand identity that resonates with readers on an emotional level.
  • Mobile Optimization: The responsive design ensures a seamless experience for all users, regardless of device.

I addressed this by developing a comprehensive mood board and leveraging Leonardo AI to generate bespoke imagery that perfectly captured the book’s themes of hope, resilience, and the journey from darkness to triumph. This resulted in a visually stunning website with a cohesive and emotionally resonant design.