Custom Storefronts — Building Commerce Anywhere

Custom Storefronts: 2017

Just as commerce has evolved over the years from market stalls, to shopping malls, to ecommerce stores, how people buy and sell continues to expand and evolve. As we continue to build the future of commerce, we want to help developers build commerce integrations in all the places where merchants want to sell, and where their customers want to buy.

With the introduction of our Custom Storefront development kit, developers can now create unique buying experiences on practically any interface.

You can develop new and unique shopping experiences on web, mobile, in-game, and much more. With Shopify’s software development kits, you can think outside the online store.

Today, we’re going to introduce you to the components of Shopify Custom Storefronts, and help you understand the opportunities each can provide.

You might also like: New Guidelines and Resources for Getting Listed in the Shopify App Store.

Storefront API

The Storefront API is the engine behind creating custom storefronts, and the easiest way to understand it is to compare it to the storefront of a retail store.

The physical storefront is an area where customers can browse and buy products. Similarly, the Storefront API powers the set of actions customers can perform in a digital store. This includes viewing products (which could include zooming on product images with jQuery image zoom), adding products to cart, and checking out. How you want to implement these features, and on which interface you want to sell is fully within your control.

Not only is the Storefront API the backbone of the Custom Storefronts SDKs, it also has a secret weapon; GraphQL. Using GraphQL, a flexible and standards-based language, the Storefront API allows you to ask for exactly what you need, and nothing more. It’s a cutting-edge query language that allows developers to efficiently get all data needed in a single request with predictable responses.

No longer tied to the Shopify-provided Online Store, you’re able to build as imaginatively as possible, while still being able to use Shopify’s suite of ecommerce capabilities.

Custom Storefronts: GraphQL
Learn more about GraphQL.

Want to learn more? Check out the Storefront API documentation.

While the Storefront API enables you to build custom storefronts with any language and technology, we have created three API client libraries for development in JavaScript, mobile (Android and iOS), and the Unity game engine, in order to simplify the development process.

1. JavaScript Buy SDK

We know that JavaScript is widely used among our Shopify developer and partner community, and want to make it easier for you to develop in your programming language of choice.

The JavaScript Buy SDK allows developers to build completely custom, branded online stores on any website. It’s suitable for merchants who want to take full advantage of Shopify’s backend capabilities, but have content needs that exceed what Shopify’s Online Store CMS can currently offer.

A good example of this is Anova Culinary. With an extremely content-heavy website, Anova was able to flexibly incorporate product checkouts in many unconventional parts of their website, such as their blog posts, without using any themes from the Shopify Online Store. Moreover, since the JavaScript SDK is easy-to-use, it helped quicken the Anova Culinary development cycle, and accelerated their time to launch.

Want to learn more? Check out the JS Buy SDK Documentation.

You might also like: Introducing BuyButton.js – Shopify's New JavaScript Library.

2. Mobile Buy SDK

With our new Mobile Buy SDKs, you’ll be able to take advantage of the flexibility and speed of our GraphQL APIs, making it even easier to bring commerce into iOS and Android apps.

Using our iOS and Android Mobile Buy SDKs, you can now build custom mobile apps that are immersive, have highly engaging buying experiences, and offer simpler checkout options with Apple and Android Pay.

Custom Storefronts: Mobile Buy SDK
Hoinkee seamlessly integrated Shopify checkout into their mobile app.

One great example of the Mobile SDK in use is within Hodinkee’s app. Without sacrificing UX, they were able to seamlessly integrate Shopify’s checkout into their mobile application.

Want to learn more? Check out the Mobile Buy SDK documentation.

You might also like: Powering Mobile Apps With the New iOS and Android Buy SDKs.

3. Unity Buy SDK

With the gaming industry growing at a staggering pace, we’re thrilled to introduce the Unity Buy SDK, to help make commerce better for game developers.

Built for the Unity game engine, we’ve created this SDK to enable gaming entrepreneurs with the ability to integrate organic, in-game buying opportunities for their players. The Unity Buy SDK lets these entrepreneurs grow their businesses, while also serving their community of enthusiasts. These experiences can also be optimized for mobile gaming, as they allow for payments through Apple Pay, creating a seamless shopping experience for iOS users.

Alto's Adventure uses the Unity Buy SDK to sell branded t-shirts and character-themed merchandise.

As an example, the mobile game Alto’s Adventure uses the Unity Buy SDK to sell branded t-shirts and character-themed merchandise. With this SDK, Alto’s Adventure was able to make the buying experience feel like an authentic part of the game’s universe, with low development effort.

Want to learn more? Check out the Unity Buy SDK documentation.

A new family of SDKs

Along with this new set of custom storefront tools, we have new docs to guide you through access and usage. To view this whole family of SDKs, take a look through the Shopify Developers page.

Which SDK are you going to check-out first? Any custom integration you’re itching to build? Tell us in the comments below!

Grow your business with the Shopify Partner Program

Learn more