View

My Starry Night

Digital

,

Print

,

Identity

,

Multimedia

,

Website and mobile app for "My Starry Night" showing circular night sky view with stars and Milky Way. Features tagline "Make the stars sing and dance for someone you love".
Website and mobile app for "My Starry Night" showing circular night sky view with stars and Milky Way. Features tagline "Make the stars sing and dance for someone you love".

Intro

Refining user experience for conversion rate optimization.

While processing data for our client, we recognized that their website faced issues regarding retention and follow-through on purchases. Of the users that visited the site, an average of 23% navigated to the product page, 8.5% made it to the cart page, and only 3% actually completed a purchase. Paired with some quality of life issues in the back-end, we proposed rebuilding the site in order to more effectively convert customers and streamline fulfillment processes.

Black smartphone displaying a circular night sky image filled with stars and the Milky Way, set against a light gray background.
Black smartphone displaying a circular night sky image filled with stars and the Milky Way, set against a light gray background.

00:00

/

00:00

Black smartphone displaying a circular night sky image filled with stars and the Milky Way, set against a light gray background.
Black smartphone displaying a circular night sky image filled with stars and the Milky Way, set against a light gray background.

Opportunity

Natural Pacing

Developed by astrophysicist Matt Russo and musician Andrew Santaguida, My Starry Night creates personalized videos of constellations that are visible on any given night and pairs them with music generated by the stars themselves. In working with a more abstract product, we determined that it would be best to stray from the current, long-form capture field and to move towards a step-by-step process for the product builder. Grouping prompts such as this would not only accommodate for the product’s many layers of customization, but it would also allow for the implementation of optional steps–a feature that the client asked us to introduce in this rebuild.

Website showing "My Starry Night" reviews section with 5-star ratings and customer testimonials on dark background, pagination buttons at bottom.
Website showing "My Starry Night" reviews section with 5-star ratings and customer testimonials on dark background, pagination buttons at bottom.

00:00

/

00:00

Website showing "My Starry Night" reviews section with 5-star ratings and customer testimonials on dark background, pagination buttons at bottom.
Website showing "My Starry Night" reviews section with 5-star ratings and customer testimonials on dark background, pagination buttons at bottom.

Development

Working from a collection of insights, I redesigned the site by grouping prompts together in a manner that promotes clarity. Building an understanding with more accessible, top-level concepts first, each input would be reflected visually in a live product builder that guides users down through smaller, more minute details. These inputs would then be translated into node attributes, capturing information in the client’s back-end for products to be created and sent automatically. In an effort to further minimize confusion, we included responsive feedback throughout the build process as an indicator for required actions and important notes. We then handed the designs off to a development team to create a custom Shopify theme.

Mobile website screens for My Starry Night web redesign project, showcasing a dark-themed interface with gold accents, starry graphics, and user-friendly navigation.
Mobile website screens for My Starry Night web redesign project, showcasing a dark-themed interface with gold accents, starry graphics, and user-friendly navigation.

00:00

/

00:00

Mobile website screens for My Starry Night web redesign project, showcasing a dark-themed interface with gold accents, starry graphics, and user-friendly navigation.
Mobile website screens for My Starry Night web redesign project, showcasing a dark-themed interface with gold accents, starry graphics, and user-friendly navigation.

Solution

Stellar System

The efforts of this website’s rebuild, along with a simultaneous brand and social media repositioning strategy, culminated in a smooth rollout for the My Starry Night product. Serving as both the point-of-sale and the fulfillment system for the company, this redesign not only aids in converting customers more efficiently but in automating back-end processes as well.

Responsive web design for "My Starry Night" showing desktop, laptop and mobile layouts with circular night sky view and menu navigation on dark background.
Responsive web design for "My Starry Night" showing desktop, laptop and mobile layouts with circular night sky view and menu navigation on dark background.

00:00

/

00:00

Responsive web design for "My Starry Night" showing desktop, laptop and mobile layouts with circular night sky view and menu navigation on dark background.
Responsive web design for "My Starry Night" showing desktop, laptop and mobile layouts with circular night sky view and menu navigation on dark background.