mCommerce Insights

Free Template: In-App Virtual Closets Encourage Larger Shopping Carts


Fashion retailers know their customers inside and out – and they know one of the major challenges their buyers have is coordinating looks that show off their favorite pieces. While brick-and-mortar stores often offer personal style consulting, online shops can miss out on this opportunity, which both affords customers a more satisfying shopping experience, and increases the shop's upselling potential. 

The good news for Shopgate merchants is that you can actually create your own version of this service, right within your app. The virtual closet feature is both functional, helping users decide which items work together, and a fun way to show off your popular pieces. Even better, you can send users right to their shopping cart to checkout from the virtual dressing room, seamlessly delivering them to a completed purchase. Besides, what fashion lover hasn't dreamed of an effortless outfit building device, a la Cher Horowitz?


One recent study found that in a quantitative online survey which polled nearly 500 mobile fashion shoppers, it was found that the smartphone is the single most valuable companion for the modern fashionista. Where half a decade ago, smartphones were just a novel accessory, they've now become an essential appendage for the shopper on the go, acting as a personal shopping assistant for so many. 

Adding a virtual closet to your app is easy. You'll just need high quality product images and some basic Photoshop skills. Follow these 5 quick steps: 

iphoneAnimation2.gif1. Identify which products you want to include, e.g.: the latest black and white trends.

2. The virtual closet is made up of three image sliders and an image identifying the theme. These are the necessary dimensions for the images: 

    1. Image Slider 1 - Top (Dimensions 1200 x 600)
    2. Image slider 2 - Bottoms (dimensions 1200 x 700)
    3. Image Slider 3 - Footewear (dimensions 1200 x 300)
    4. Image 4 - Image with title theme ("Black & White Trends") (1200 x 100)

3. Create four files in Photoshop. Use the guides in the provided templates to help ensure the edges of the tops, bottoms and shoes are aligned correctly. Be sure the widths of the items line up, and place arrows on the left and right of each item to indicate the slider function. Create a 3-pixel thick line between each slider image to make for softer transitions.

4. Now that your graphics are complete, go into the Shopgate platform and create three new image sliders. Be sure to use the dimensions mentioned above. Then, upload the images to their respective sliders, and link to the corresponding product for each. Don't forget to add the static image at the bottom for reference.  

5. Create a banner on your homepage to send users to your shiny new virtual closet! This will put your products right in front of your customers in an engaging way, increasing conversion rates and encouraging users to come back periodically for updated style inspiration. 

Download Templates

Want more app design inspiration? See our top design tips here, then download RETENTION Magazine to discover the secret to retaining customers to turn your app into powerful loyalty tool.

Amanda Laviana

Written by Amanda Laviana

Marketing Communications Manager | Amanda is an experienced content marketer, with a background in advertising copywriting. She manages content across an array of platforms for Shopgate, including blogs, whitepapers, webinars, social media and video.


Receive weekly mcommerce news, strategies and analysis delivered straight to your inbox.


Request a Demo