Jakub Józef Orliński Fanbase Website Prototype

Objective

Develop a functional prototype showcasing the integration of web3 technology in a fanbase website.

My Role

As the product designer of Latecheckout studio during the prototype phase, my responsibilities included:

Conceptualization

Ideating and conceptualizing the key features of the web3-integrated fanbase website prototype.

Wireframing & Prototyping

Creating low-fidelity wireframes and interactive prototypes to visualize the structure and functionality of the design.

Tools:

Figma, Adobe Photoshop

Role:

Product Designer

Team:

2 Product Designers, 1 Project Manager, 1 Account Executive

Timeline:

2 Weeks (80 Hours)

Project Brief

Background

Jakub is a WMG-signed opera singer/breakdancer with an audience of primarily women ranging from 20-55 ( primarily 40+ years old). He is handsome and his team says to consider his face/persona the primary feature that we need to emphasize in projects with him.

Goals

  • Build the Jakub website page into a Hidden Garden “world”. A highly engaging, intuitive website that fans can think is beautiful and fascinating even if they don’t choose to engage with the website and only see it at first glance.

  • Within the “world”, user can click into different components that lead them to different types of content.

  • Listen to music through a music player.

Key functionality/actions to prototype

  • Clicking to enter the new Hidden Garden page from the Jakub website.

  • Prompt: enters the world from the top and makes a ‘magical” experience out of the website loading.

  • Playing/pausing music player.

  • Clicking all of the clickable components/“buildings” (any icons, motion, interactions), then clicking out of them to explore the world more.

  • Leaving the “Hidden Garden” tab.

jjo-picture

photo copyright warnermusic

Diving into prototyping felt a bit like exploring a new territory.

Sketching things out was a bit tricky because I had to turn complicated ideas into actual screens. It was like finding the right rhythm between coming up with cool ideas and making sure everything made sense.

Sketches

Sketching allowed me to gain a rough understanding of key screens as well as map out necessary features.

uxflow-jjo

Sketch for the site flow information

sketch-03

Sketch for the Hidden Garden Interactive Web - Concept Direction 3

sketch-01

Sketch for the Hidden Garden Interactive Web - Concept Direction 01

sketch-02

Sketch for the Hidden Garden Interactive Web - Concept Direction 02

uxflow-jjo

Sketch for the Hidden Garden Assets and Map for interactive website

Prototype

Prototyping has empowered me to establish a preliminary comprehension of essential screens and strategically outline indispensable features. This iterative process allows me to visualize and refine the user experience, ensuring a seamless and efficient flow throughout the prototype. By incorporating feedback and making necessary adjustments, I can craft a refined model that serves as a dynamic blueprint for the development phase.

When I started mapping out the prototype, the struggle was balancing a bunch of features with keeping things simple. It was like solving a puzzle, deciding which parts were the most important and making sure everything fit together smoothly. I had to constantly rethink and tweak things to make sure the prototype not only had lots of cool stuff but was also easy for people to use.

Getting feedback added another layer of difficulty. I had to figure out how to take suggestions without losing the main idea. It wasn't just about finding problems but turning those ideas into improvements. Each time I made changes, it was like taking a step forward, making the prototype better and more user-friendly.

welcome to hidden garden

Welcome screen for Hidden Garden concept

open the hidden garden door

Welcome screen for Hidden Garden concept - open the door

But you know what? All those challenges actually made the whole process more interesting. Each problem turned into a chance to learn and get better. It was like turning roadblocks into cool design ideas. The struggle wasn't something stopping me; it was pushing me to think differently and make the prototype even better.

In the end, all those challenges became part of the story. It's not just about making a design; it's about facing problems, finding solutions, and ending up with something awesome. The prototype is more than just a bunch of screens; it's a journey where struggles turned into breakthroughs, bringing us closer to a final product that's polished and makes a real impact.

REFLECTION

As we reflect on the prototyping process, it's clear that navigating constraints fueled our creativity. Faced with engineering, budget, and timeline limitations, we had to make strategic decisions.

These constraints became guiding principles, forcing us to prioritize and carefully scope our choices. We took our raw ideas, threw them into the mix, and iterated tirelessly until we uncovered the most effective collective solution. Quick, rough feedback loops became instrumental in refining our design direction.

An essential aspect of our journey was the consistent involvement of not just engineers but also Project Managers (PM) and Account Executives (AE), alongside incorporating feedback from our clients.

Collaborating with PMs and AEs early on was invaluable, providing insights into project dynamics and ensuring alignment with both client expectations and project goals. This holistic collaboration enhanced communication channels, fostering an environment where all stakeholders contributed to the success of the project.

plant-grow

‍Next Steps.

This is an ongoing project with challenges that will evolve throughout development, but I am excited to see Jakub Hidden Garden launch in the coming year.

Jakub Józef Orliński Fanbase Website Prototype

Objective

Develop a functional prototype showcasing the integration of web3 technology in a fanbase website.

My Role

As the product designer of Latecheckout studio during the prototype phase, my responsibilities included:

Conceptualization

Ideating and conceptualizing the key features of the web3-integrated fanbase website prototype.

Wireframing & Prototyping

Creating low-fidelity wireframes and interactive prototypes to visualize the structure and functionality of the design.

Tools:

Figma, Adobe Photoshop

Role:

Product Designer

Team:

2 Product Designers, 1 Project Manager, 1 Account Executive

Timeline:

2 Weeks (80 Hours)

Project Brief

Background

Jakub is a WMG-signed opera singer/breakdancer with an audience of primarily women ranging from 20-55 ( primarily 40+ years old). He is handsome and his team says to consider his face/persona the primary feature that we need to emphasize in projects with him.

Goals

  • Build the Jakub website page into a Hidden Garden “world”. A highly engaging, intuitive website that fans can think is beautiful and fascinating even if they don’t choose to engage with the website and only see it at first glance.

  • Within the “world”, user can click into different components that lead them to different types of content.

  • Listen to music through a music player.

Key functionality/actions to prototype

  • Clicking to enter the new Hidden Garden page from the Jakub website.

  • Prompt: enters the world from the top and makes a ‘magical” experience out of the website loading.

  • Playing/pausing music player.

  • Clicking all of the clickable components/“buildings” (any icons, motion, interactions), then clicking out of them to explore the world more.

  • Leaving the “Hidden Garden” tab.

jjo-picture

photo copyright warnermusic

Diving into prototyping felt a bit like exploring a new territory.

Sketching things out was a bit tricky because I had to turn complicated ideas into actual screens. It was like finding the right rhythm between coming up with cool ideas and making sure everything made sense.

Sketches

Sketching allowed me to gain a rough understanding of key screens as well as map out necessary features.

uxflow-jjo

Sketch for the site flow information

sketch-03

Sketch for the Hidden Garden Interactive Web - Concept Direction 3

sketch-01

Sketch for the Hidden Garden Interactive Web - Concept Direction 01

sketch-02

Sketch for the Hidden Garden Interactive Web - Concept Direction 02

uxflow-jjo

Sketch for the Hidden Garden Assets and Map for interactive website

Prototype

Prototyping has empowered me to establish a preliminary comprehension of essential screens and strategically outline indispensable features. This iterative process allows me to visualize and refine the user experience, ensuring a seamless and efficient flow throughout the prototype. By incorporating feedback and making necessary adjustments, I can craft a refined model that serves as a dynamic blueprint for the development phase.

When I started mapping out the prototype, the struggle was balancing a bunch of features with keeping things simple. It was like solving a puzzle, deciding which parts were the most important and making sure everything fit together smoothly. I had to constantly rethink and tweak things to make sure the prototype not only had lots of cool stuff but was also easy for people to use.

Getting feedback added another layer of difficulty. I had to figure out how to take suggestions without losing the main idea. It wasn't just about finding problems but turning those ideas into improvements. Each time I made changes, it was like taking a step forward, making the prototype better and more user-friendly.

welcome to hidden garden

Welcome screen for Hidden Garden concept

open the hidden garden door

Welcome screen for Hidden Garden concept - open the door

But you know what? All those challenges actually made the whole process more interesting. Each problem turned into a chance to learn and get better. It was like turning roadblocks into cool design ideas. The struggle wasn't something stopping me; it was pushing me to think differently and make the prototype even better.

In the end, all those challenges became part of the story. It's not just about making a design; it's about facing problems, finding solutions, and ending up with something awesome. The prototype is more than just a bunch of screens; it's a journey where struggles turned into breakthroughs, bringing us closer to a final product that's polished and makes a real impact.

REFLECTION

As we reflect on the prototyping process, it's clear that navigating constraints fueled our creativity. Faced with engineering, budget, and timeline limitations, we had to make strategic decisions.

These constraints became guiding principles, forcing us to prioritize and carefully scope our choices. We took our raw ideas, threw them into the mix, and iterated tirelessly until we uncovered the most effective collective solution. Quick, rough feedback loops became instrumental in refining our design direction.

An essential aspect of our journey was the consistent involvement of not just engineers but also Project Managers (PM) and Account Executives (AE), alongside incorporating feedback from our clients.

Collaborating with PMs and AEs early on was invaluable, providing insights into project dynamics and ensuring alignment with both client expectations and project goals. This holistic collaboration enhanced communication channels, fostering an environment where all stakeholders contributed to the success of the project.

plant-grow

‍Next Steps.

This is an ongoing project with challenges that will evolve throughout development, but I am excited to see Jakub Hidden Garden launch in the coming year.

Jakub Józef Orliński Fanbase Website Prototype

Objective

Develop a functional prototype showcasing the integration of web3 technology in a fanbase website.

My Role

As the product designer of Latecheckout studio during the prototype phase, my responsibilities included:

Conceptualization

Ideating and conceptualizing the key features of the web3-integrated fanbase website prototype.

Wireframing & Prototyping

Creating low-fidelity wireframes and interactive prototypes to visualize the structure and functionality of the design.

Tools:

Figma, Adobe Photoshop

Role:

Product Designer

Team:

2 Product Designers, 1 Project Manager, 1 Account Executive

Timeline:

2 Weeks (80 Hours)

Project Brief

Background

Jakub is a WMG-signed opera singer/breakdancer with an audience of primarily women ranging from 20-55 ( primarily 40+ years old). He is handsome and his team says to consider his face/persona the primary feature that we need to emphasize in projects with him.

Goals

  • Build the Jakub website page into a Hidden Garden “world”. A highly engaging, intuitive website that fans can think is beautiful and fascinating even if they don’t choose to engage with the website and only see it at first glance.

  • Within the “world”, user can click into different components that lead them to different types of content.

  • Listen to music through a music player.

Key functionality/actions to prototype

  • Clicking to enter the new Hidden Garden page from the Jakub website.

  • Prompt: enters the world from the top and makes a ‘magical” experience out of the website loading.

  • Playing/pausing music player.

  • Clicking all of the clickable components/“buildings” (any icons, motion, interactions), then clicking out of them to explore the world more.

  • Leaving the “Hidden Garden” tab.

jjo-picture

photo copyright warnermusic

Diving into prototyping felt a bit like exploring a new territory.

Sketching things out was a bit tricky because I had to turn complicated ideas into actual screens. It was like finding the right rhythm between coming up with cool ideas and making sure everything made sense.

Sketches

Sketching allowed me to gain a rough understanding of key screens as well as map out necessary features.

uxflow-jjo

Sketch for the site flow information

sketch-03

Sketch for the Hidden Garden Interactive Web - Concept Direction 3

sketch-01

Sketch for the Hidden Garden Interactive Web - Concept Direction 01

sketch-02

Sketch for the Hidden Garden Interactive Web - Concept Direction 02

uxflow-jjo

Sketch for the Hidden Garden Assets and Map for interactive website

Prototype

Prototyping has empowered me to establish a preliminary comprehension of essential screens and strategically outline indispensable features. This iterative process allows me to visualize and refine the user experience, ensuring a seamless and efficient flow throughout the prototype. By incorporating feedback and making necessary adjustments, I can craft a refined model that serves as a dynamic blueprint for the development phase.

When I started mapping out the prototype, the struggle was balancing a bunch of features with keeping things simple. It was like solving a puzzle, deciding which parts were the most important and making sure everything fit together smoothly. I had to constantly rethink and tweak things to make sure the prototype not only had lots of cool stuff but was also easy for people to use.

Getting feedback added another layer of difficulty. I had to figure out how to take suggestions without losing the main idea. It wasn't just about finding problems but turning those ideas into improvements. Each time I made changes, it was like taking a step forward, making the prototype better and more user-friendly.

welcome to hidden garden

Welcome screen for Hidden Garden concept

open the hidden garden door

Welcome screen for Hidden Garden concept - open the door

But you know what? All those challenges actually made the whole process more interesting. Each problem turned into a chance to learn and get better. It was like turning roadblocks into cool design ideas. The struggle wasn't something stopping me; it was pushing me to think differently and make the prototype even better.

In the end, all those challenges became part of the story. It's not just about making a design; it's about facing problems, finding solutions, and ending up with something awesome. The prototype is more than just a bunch of screens; it's a journey where struggles turned into breakthroughs, bringing us closer to a final product that's polished and makes a real impact.

REFLECTION

As we reflect on the prototyping process, it's clear that navigating constraints fueled our creativity. Faced with engineering, budget, and timeline limitations, we had to make strategic decisions.

These constraints became guiding principles, forcing us to prioritize and carefully scope our choices. We took our raw ideas, threw them into the mix, and iterated tirelessly until we uncovered the most effective collective solution. Quick, rough feedback loops became instrumental in refining our design direction.

An essential aspect of our journey was the consistent involvement of not just engineers but also Project Managers (PM) and Account Executives (AE), alongside incorporating feedback from our clients.

Collaborating with PMs and AEs early on was invaluable, providing insights into project dynamics and ensuring alignment with both client expectations and project goals. This holistic collaboration enhanced communication channels, fostering an environment where all stakeholders contributed to the success of the project.

plant-grow

‍Next Steps.

This is an ongoing project with challenges that will evolve throughout development, but I am excited to see Jakub Hidden Garden launch in the coming year.

Jakub Józef Orliński Fanbase Website Prototype

Objective

Develop a functional prototype showcasing the integration of web3 technology in a fanbase website.

My Role

As the product designer of Latecheckout studio during the prototype phase, my responsibilities included:

Conceptualization

Ideating and conceptualizing the key features of the web3-integrated fanbase website prototype.

Wireframing & Prototyping

Creating low-fidelity wireframes and interactive prototypes to visualize the structure and functionality of the design.

Tools:

Figma, Adobe Photoshop

Role:

Product Designer

Team:

2 Product Designers, 1 Project Manager, 1 Account Executive

Timeline:

2 Weeks (80 Hours)

Project Brief

Background

Jakub is a WMG-signed opera singer/breakdancer with an audience of primarily women ranging from 20-55 ( primarily 40+ years old). He is handsome and his team says to consider his face/persona the primary feature that we need to emphasize in projects with him.

Goals

  • Build the Jakub website page into a Hidden Garden “world”. A highly engaging, intuitive website that fans can think is beautiful and fascinating even if they don’t choose to engage with the website and only see it at first glance.

  • Within the “world”, user can click into different components that lead them to different types of content.

  • Listen to music through a music player.

Key functionality/actions to prototype

  • Clicking to enter the new Hidden Garden page from the Jakub website.

  • Prompt: enters the world from the top and makes a ‘magical” experience out of the website loading.

  • Playing/pausing music player.

  • Clicking all of the clickable components/“buildings” (any icons, motion, interactions), then clicking out of them to explore the world more.

  • Leaving the “Hidden Garden” tab.

jjo-picture

photo copyright warnermusic

Diving into prototyping felt a bit like exploring a new territory.

Sketching things out was a bit tricky because I had to turn complicated ideas into actual screens. It was like finding the right rhythm between coming up with cool ideas and making sure everything made sense.

Sketches

Sketching allowed me to gain a rough understanding of key screens as well as map out necessary features.

uxflow-jjo

Sketch for the site flow information

sketch-03

Sketch for the Hidden Garden Interactive Web - Concept Direction 3

sketch-01

Sketch for the Hidden Garden Interactive Web - Concept Direction 01

sketch-02

Sketch for the Hidden Garden Interactive Web - Concept Direction 02

uxflow-jjo

Sketch for the Hidden Garden Assets and Map for interactive website

Prototype

Prototyping has empowered me to establish a preliminary comprehension of essential screens and strategically outline indispensable features. This iterative process allows me to visualize and refine the user experience, ensuring a seamless and efficient flow throughout the prototype. By incorporating feedback and making necessary adjustments, I can craft a refined model that serves as a dynamic blueprint for the development phase.

When I started mapping out the prototype, the struggle was balancing a bunch of features with keeping things simple. It was like solving a puzzle, deciding which parts were the most important and making sure everything fit together smoothly. I had to constantly rethink and tweak things to make sure the prototype not only had lots of cool stuff but was also easy for people to use.

Getting feedback added another layer of difficulty. I had to figure out how to take suggestions without losing the main idea. It wasn't just about finding problems but turning those ideas into improvements. Each time I made changes, it was like taking a step forward, making the prototype better and more user-friendly.

welcome to hidden garden

Welcome screen for Hidden Garden concept

open the hidden garden door

Welcome screen for Hidden Garden concept - open the door

But you know what? All those challenges actually made the whole process more interesting. Each problem turned into a chance to learn and get better. It was like turning roadblocks into cool design ideas. The struggle wasn't something stopping me; it was pushing me to think differently and make the prototype even better.

In the end, all those challenges became part of the story. It's not just about making a design; it's about facing problems, finding solutions, and ending up with something awesome. The prototype is more than just a bunch of screens; it's a journey where struggles turned into breakthroughs, bringing us closer to a final product that's polished and makes a real impact.

REFLECTION

As we reflect on the prototyping process, it's clear that navigating constraints fueled our creativity. Faced with engineering, budget, and timeline limitations, we had to make strategic decisions.

These constraints became guiding principles, forcing us to prioritize and carefully scope our choices. We took our raw ideas, threw them into the mix, and iterated tirelessly until we uncovered the most effective collective solution. Quick, rough feedback loops became instrumental in refining our design direction.

An essential aspect of our journey was the consistent involvement of not just engineers but also Project Managers (PM) and Account Executives (AE), alongside incorporating feedback from our clients.

Collaborating with PMs and AEs early on was invaluable, providing insights into project dynamics and ensuring alignment with both client expectations and project goals. This holistic collaboration enhanced communication channels, fostering an environment where all stakeholders contributed to the success of the project.

plant-grow

‍Next Steps.

This is an ongoing project with challenges that will evolve throughout development, but I am excited to see Jakub Hidden Garden launch in the coming year.

LET’S WORK


TOGETHER

SEND ME A MESSAGE

SEND ME A MESSAGE

SEND ME A MESSAGE