Store website design for an infinite product

Store website design for an infinite product

Store website design for an infinite product

Store website design for an infinite product

With Puzzle Face you can create countless puzzles from any photo, but it's hard to understand at first and they didn't have a centralized place for purchases
Tools
Figma, Photoshop, Illustrator, After Effects
Skills
User Research, Content Strategy, Sitemapping, Wireframing, Prototyping, Interaction Design
Project outcomeS
1k
Website visitors within the first weeks
18%
Visitors converted to sales
Objective
Puzzle Face needed a website that clearly communicated how the game worked to both parents and wholesale buyers

Objective
Puzzle Face needed a website that clearly communicated how the game worked to both parents and wholesale buyers

Objective
Puzzle Face needed a website that clearly communicated how the game worked to both parents and wholesale buyers

Objective
Puzzle Face needed a website that clearly communicated how the game worked to both parents and wholesale buyers

The approach
We leveraged the existing package's design and photography to showcase the contents and mechanics in a playful way
The approach
We leveraged the existing package's design and photography to showcase the contents and mechanics in a playful way
The approach
We leveraged the existing package's design and photography to showcase the contents and mechanics in a playful way
The approach
We leveraged the existing package's design and photography to showcase the contents and mechanics in a playful way

Making inventory of content and needs
We had an existing library of content we could use, but having reviewed other game sites we realized we needed more to cover the basic needs

Making inventory of content and needs
We had an existing library of content we could use, but having reviewed other game sites we realized we needed more to cover the basic needs

Making inventory of content and needs
We had an existing library of content we could use, but having reviewed other game sites we realized we needed more to cover the basic needs

Making inventory of content and needs
We had an existing library of content we could use, but having reviewed other game sites we realized we needed more to cover the basic needs

Getting to the point
Presenting users with a purchasing option at first helps familair users buy quicker

Getting to the point
Presenting users with a purchasing option at first helps familair users buy quicker

Getting to the point
Presenting users with a purchasing option at first helps familair users buy quicker

Getting to the point
Presenting users with a purchasing option at first helps familair users buy quicker

Defining contents
Descriptions of content would help users understand what they'd get for their money is, along with basic game information

Defining contents
Descriptions of content would help users understand what they'd get for their money is, along with basic game information

Defining contents
Descriptions of content would help users understand what they'd get for their money is, along with basic game information

Defining contents
Descriptions of content would help users understand what they'd get for their money is, along with basic game information

How it works
A step-by-step guide defining the process of how to generate a puzzle clearly show the gameplay loop rounded out by a video tutorial

How it works
A step-by-step guide defining the process of how to generate a puzzle clearly show the gameplay loop rounded out by a video tutorial

How it works
A step-by-step guide defining the process of how to generate a puzzle clearly show the gameplay loop rounded out by a video tutorial

How it works
A step-by-step guide defining the process of how to generate a puzzle clearly show the gameplay loop rounded out by a video tutorial

Lingering questions and pieces
FAQs allowed us to answer any remaining questions. We decorated with puzzle pieces to add texture and visual interest.

Lingering questions and pieces
FAQs allowed us to answer any remaining questions. We decorated with puzzle pieces to add texture and visual interest.

Lingering questions and pieces
FAQs allowed us to answer any remaining questions. We decorated with puzzle pieces to add texture and visual interest.

Lingering questions and pieces
FAQs allowed us to answer any remaining questions. We decorated with puzzle pieces to add texture and visual interest.
Results
We launched right as a media tour was planned which allowed us to drive tons of traffic to the site. For the first 1,000 visitors 18% converted to sales. We got compliments over the experience and design from toy sellers and parents alike.
Results
We launched right as a media tour was planned which allowed us to drive tons of traffic to the site. For the first 1,000 visitors 18% converted to sales. We got compliments over the experience and design from toy sellers and parents alike.
Results
We launched right as a media tour was planned which allowed us to drive tons of traffic to the site. For the first 1,000 visitors 18% converted to sales. We got compliments over the experience and design from toy sellers and parents alike.
Results
We launched right as a media tour was planned which allowed us to drive tons of traffic to the site. For the first 1,000 visitors 18% converted to sales. We got compliments over the experience and design from toy sellers and parents alike.
My reflections on what I learned with this project and areas I feel could be improved:
Learnings
Photography was crucial for this project, unlike previous ones. I justified the shoot's cost with research and content needs, which greatly enhanced the project and highlighted the importance of strong visuals.
Working with a developer on my second Squarespace project significantly increased custom code flexibility. This experience provided a better understanding of Squarespace's limitations and possibilities.
Areas of Opportunity
I regret not adding more interactivity, like assembling and flipping puzzle pieces on the site. While complex, it would have clarified instructions.
My reflections on what I learned with this project and areas I feel could be improved:
Learnings
Photography was crucial for this project, unlike previous ones. I justified the shoot's cost with research and content needs, which greatly enhanced the project and highlighted the importance of strong visuals.
Working with a developer on my second Squarespace project significantly increased custom code flexibility. This experience provided a better understanding of Squarespace's limitations and possibilities.
Areas of Opportunity
I regret not adding more interactivity, like assembling and flipping puzzle pieces on the site. While complex, it would have clarified instructions.
My reflections on what I learned with this project and areas I feel could be improved:
Learnings
Photography was crucial for this project, unlike previous ones. I justified the shoot's cost with research and content needs, which greatly enhanced the project and highlighted the importance of strong visuals.
Working with a developer on my second Squarespace project significantly increased custom code flexibility. This experience provided a better understanding of Squarespace's limitations and possibilities.
Areas of Opportunity
I regret not adding more interactivity, like assembling and flipping puzzle pieces on the site. While complex, it would have clarified instructions.
My reflections on what I learned with this project and areas I feel could be improved:
Learnings
Photography was crucial for this project, unlike previous ones. I justified the shoot's cost with research and content needs, which greatly enhanced the project and highlighted the importance of strong visuals.
Working with a developer on my second Squarespace project significantly increased custom code flexibility. This experience provided a better understanding of Squarespace's limitations and possibilities.
Areas of Opportunity
I regret not adding more interactivity, like assembling and flipping puzzle pieces on the site. While complex, it would have clarified instructions.
Special Shout-outs:
Client
Sylvia Stein
Developer
Serhiy Grabarchuk
Copy Assistance
Elissa Lavey
There are obviously many more people who helped out. While I may not have the space here, thank you 👏
Special Shout-outs:
Client
Sylvia Stein
Developer
Serhiy Grabarchuk
Copy Assistance
Elissa Lavey
There are obviously many more people who helped out. While I may not have the space here, thank you 👏
Special Shout-outs:
Client
Sylvia Stein
Developer
Serhiy Grabarchuk
Copy Assistance
Elissa Lavey
There are obviously many more people who helped out. While I may not have the space here, thank you 👏
Special Shout-outs:
Client
Sylvia Stein
Developer
Serhiy Grabarchuk
Copy Assistance
Elissa Lavey
There are obviously many more people who helped out. While I may not have the space here, thank you 👏