Responsive Redesign of Shopify.com and MTV.com

Posted on 21. Apr, 2015 in About Shopify, Ecommerce

One of the regular podcasts that I listen too did an interview with Monica, a lead frontend designer from Shopify, about converting shopify.com to full responsive design. Responsive design is an elegant way to make sure your site works on all devices regardless of screen resolution or size. However, it can be a very tricky undertaking if not done right from the beginning. These two podcasts personally struck home with me because of the contrast between shopify’s approach to design and getting real user feedback vs. MTV’s approach of building out the entire site first and then launching it. They both had a similar situation of a giant traffic site that needed to make the switch; however the fundamental thinking was completely different. Shopify took it in bite size pieces which let them iterate and perfect the design. This has always been their approach.  Where MTV tried to roll out the whole thing at once on a smaller less important site.

Now in all fairness, I do believe its an unfair comparison because MTV has 20 years of legacy development they need to address first; and I was very impressed about how they are planning on future proofing their images. However, the thing that I took away from these two podcast is shopify’s thought pattern about how you must continually be building your site.  Websites grow and evolve, you are never compete. Its this fundamental approach to design which has made shopify the largest and easiest to use ecommerce software in the world.

Love to hear your comments.

Enjoy

Screen Shot 2015-04-14 at 1.22.33 PM

Episode #33

A Responsive Web Design Podcast

Listen to Episode with shopify
Listen to Episode with MTV

Using Shopify as a Wholesale Tool

Posted on 14. Apr, 2015 in About Shopify, Clients Websites, Development, Tweaks

What Leah had to say about the project

When I decided to build a new wholesale site, I didn’t know where to start. I’m so glad I found the guys at Sunbowl. They did a great job of planning the project with me so that we could create a great user experience. I like to learn how to edit things on my own, so I really appreciated the video tutorials they sent me. They were super helpful with figuring out the technical aspects of the project and were really timely with their delivery. I would highly recommend them to anyone!

The site was a huge success – we generated over 40K in sales in the first month.

Leah Emmott, CEO, Inner Fire Apparel

 

Everybody knows that Shopify is really great for doing your online e-commerce when you’re selling from business to customer. What I’m going to show you is if when you want to use Shopify in order to use it in a business to business situation. For example, I’m going to show you how it works really, really well and powerfully with a wholesale opportunity.

[00:02:00] With my Inner Fire, they already had a Shopify store and they wanted to add a wholesale component to that store. What we were able to do was use a second Shopify store in order to set that up for them. When you’re on the regular shop, just to compare. If we were a regular shopper and we wanted to buy some leggings we would pick the leggings that we wanted, then we would read through the descriptions and then we would add them to the cart and then we would get to check out.
We can change our quantities. We could see what we were purchasing and check out in a normal fashion. That works very well for buying single products. However, when you’re buying multiple products and if you’re doing a group buy, it’s not the best system to use because it’s very cumbersome and it’s hard to make sure that you got your orders correct. We did a little bit of a different approach to how to do it for a wholesale side of things.
Two things, one, the first thing we did is we wanted to make sure the wholesale side was password protected. There’s a lot of reasons for doing this. We wanted to be able to approve accounts for people to get there because they have to go through a certain credit check first. They have to be authorized dealers. There’s a lot of extra stuff that happens when you’re dealing with just wholesale clients.
When you go to the wholesale in your Fire account, it will take you to a login where the customer would then be able to log in and get to their site. Once they’ve logged in, they come to a nicely designed site just like you would normally have. If we were to go to the homepage it would come up wholesale site, very similar to their other site.

You can look up all different information. They have their polices, they have their FAQs, they have their look book, they have their catalogs. A lot of this stuff is new lines that are coming out that are not available to the public so it’s a different inventory.

When you go and actually select a t-shirt, which I have a sample here, you can see that the layout is slightly different than it was on their online store. The reason we built it this way was because we were finding it was very cumbersome to be adding one product to each cart by just copying over your existing store. There’s a lot of tweaks that need to happen when you’re opening up a second wholesale store.

The first thing with these guys is that you’re able to pick the graphics. I’m going to pick believe in yourself and I’m going to pick with a gray tanktop. We come down here and we get this great chart that tells us which products are in stock, which ones were out of stock and which ones we’re able to order. Theoretically, I can order 15 smalls, I can order four mediums, and I can order two larges. Say I wanted also to get the try coffee ones, I could order 20 here as well, maybe 10 here. Maybe they’re a little bit more popular and it will add them up on the right hand side.

These are just sample pricing that I’ve put in here for the purpose of this video but you can see that each item gets added together and it gives you a line item so you know how much each one of them is going to cost. If you’ve only got a specific budget, say you wanted to put a couple numbers in here and you knew that you only have $170 to spend on these particular items it’ll allow you to add it all up.
When you’re finished you can hit the Add to Cart icon. It will process everything and it will add it to the cart. It will add all your items to the cart. You could see your total number of items that are going to be checked out is 156. That only took me a couple seconds to put into the system, but if I was to do that one by one it would be a very cumbersome style of adding stuff over.

[00:04:00] If I go over to the cart, I can then see a preview of everything that I’m going to order. I can see the colors of my shirts. I can click on and see the graphic that I want to be able to be printed on the shirt. I could update my quantities and then I can also check my additional options. Do you need your items priced and is back ordering okay or are substitutions okay? It might be okay for you.

I can then go to my checkout and I can proceed through my checkout like I normally would. The cool thing about when you do the checkout is you’re able to go to checkout and you have to do a $300 minimum order so that you’re not dealing with these small order. Obviously if you’re a wholesale person and then you know you have the minimum order you need to make and you can make these type of check, it’s a user-friendly interface for buyers.
The buyers can sit down. They can really visually see what you’re looking at. They’re not looking through a catalog or filling out an Excel spreadsheet. Everything is accurately itemized and you can see the graphics of things that are going on and it works out very, very well. I’m going to update some of these here too a little bit more. I’m going to say I’m going to get 300 of them.

Refresh it there and now I’m above my minimum order so now I can check out. I can choose my payment method. I can either go by credit card, pay for it right now. I can go buy PayPal or I could go by bank deposit. There are multiple payment options that you could set up, especially when using a wholesale site. The great thing about it is you can have, because it’s password protected you could have them put the order in and you could do net 30 or you can do net 60 and then that can be imported directly into the accounting system that you’re using.

[00:06:00] Because it’s Shopify it has an API in it where we can actually connect it with your accounting system so it can go straight into if it accepts external inputs. Or you can change or you can run your business where they have to pay for the whole thing upfront based on credit cards. That’s really great to do if you’re doing closeout stuff or you’re doing sample sales or you’re doing that sort of thing where you’re trying to relieve  some of the other products.

That is overview of what we can do with a wholesale environment through Shopify. It’s a great place to expand your business and a really, really nice easy user interface to get away from those Excel spreadsheets and those fax forms we’re so used to.

Shopify Dashboard Update

Posted on 02. Apr, 2015 in About Shopify, Development

I’m going to do an overview of the new Shopify upgrade from Multi-Channel Support. This is a new update that they’re going to be rolling out in the next couple of weeks.
First, they’re going to roll it out to five percent of people, then to twenty-five percent of people, then to a hundred percent of people over the next month or so.

The biggest change that’s being done is they’re now making Shopify the central dashboard for all of your online sales. The way that they’re doing that is they’re adding these links on the left-hand side here to allow for each individual channel.
Right now, when you set up your Shopify store as a new store, you’re going to get online store and point of sales. That’s if you’re using the point of sales system.

If you’re going to be also using “buy now” button, which you can use to put onto a WordPress site, or you can use to put onto a Square Space site. What you’ll need to do is you’ll need to go to “settings”. Then you’ll need to go to “sales channels” in order to turn it on. It’ll give you your multiple sales channels below you and simply hit “add channel”. I want to add a Shopify Buy button and what you’ll see is on the left you’ll now have the buy button channel which will be added into your store.
The first thing I need to do to use this, is I’m going to need to go and create products. What I’m going to to do is I’m going to go through the other changes and show you were the other stuff is. Then I’ll come back and show you how the buy button new app works.

First of all, what they’ve done is they’ve shortened down the product list, or the navigation list on the left-hand side, and combined a bunch of things. Either you’re working in your home dashboard which is a whole new slew of updates as well as information pieces that come in. They all feed in from the sales channels on the left.

You have your orders page which is as similar as it always was before. When you have new orders in here they will show up in here. The order tracking and the order fulfillment is remaining the same.

[00:02:00] For the most part, not a lot is going be changing. It’s all the external services that you’re going to be working on that’ll change.

If you go into products, you can see now that this small little list slides over. Now you can see where you actually add products. This is adding an additional click to the navigation. Time will tell whether it’ll be annoying or not, but from what I can see it looks like it’s a pretty good idea. You’ve now got product list, inventory, your collections and your gift cards all underneath your same product dialogue box.

The next one is customers. This is similar to the customer dashboard before. It hasn’t changed at all.

Reports, again, also hasn’t changed. Still the similar reports.

The same with discount codes. Discount codes are being done the same way.

The biggest change is where you’re going to go in order to get access to your theme settings. If you go to “online store”, you can see this is where you’re going to get access to doing your overview, your blog post, changes to your pages, your themes, your navigation and your domains. For us as Shopify experts, this was the biggest change for us because we need to be able to go in and modify themes and so on and so forth.
Once you get into the actual pages themselves, they’re exactly the same as they were before. It’s just the navigation that you need to use to get there is an additional click now.
Point of sale, same thing. You have your overview and your locations like you would previously.

Next is the buy button. The new buy button app that I was talking about.

Finally, the settings button on the left will allow you to change all your settings. Your general, your payment, your checkout, your shipping, your taxes, your notifications, your gift cards, your files, your account. Again, your sales channels. As well as your settings for the online store and the point of sales store.

That is pretty much the major changes.

[00:04:00] If you click on this guy here, this is your “view your website” button. It used to be down at the bottom. They’ve removed those buttons down from the bottom now and they’ve moved them up here so if you’re looking for “view your website”, that’s where that one is. If you click on here this is your new log in/log out button. As well as your “hire an expert” and your community forums as well.
They’ve reduced the number of buttons they have on the navigation in order to make it a little bit cleaner for you to use as well.

If you have any comments or you would like to know where something is, leave it in the comments down below.

Good luck with the new dashboard

Resource: Shopify Blog Post

Sneak Peak at Shopify’s New Product Page

Posted on 12. Mar, 2015 in About Shopify, Getting Started

Here is a sneak peak at the changes coming to shopify’s product page. This video will help you get orientated with the new location of features.

How to find the variant id of a product

Posted on 15. Aug, 2014 in About Shopify, Advanced Tricks, Tweaks

*** Update: This only works in Firefox or Chrome. Safari doesn’t show a formated XML sheet which makes it almost impossible to find the variant id

[00:0:00] – Finding the Variant ID

I’m going to walk you through on how to find the variant ID of a product. This comes up in a couple of different situations, mostly when we want to generate a link that will take you directly to the checkout page for a client. This happens quite often when we want to say, “Okay. This is a product you want to buy, I’m going to put a link right here in your email. When you click on it, it will take you to the checkout page.”

To find that variant ID, what we want to do is we want to go to “Products”, and then we want to pick a products on and pick our “5 Hour Bucket” here.

This is our product that’s listed on our website. You can go through and buy it. But I want to create a buy now link specifically for one specific customer. When I get to a product, what I can do is I can put a .xml on the end of this product ID and what it will do is it will give us a XML sheet. This is all of the details that is put into a high arcal type of appearance so that you can see all the different pieces in a more cleaner form. When looking for a variant ID, what you want to do is you want to come down here to variants, because there you can see, this is where the variants are left in.
If you have multiple ones, there’s going to be multiple variant boxes here. If this say had different size T-shirts or there were different colors or whatever, each one is going to be a seperate variant, so the id’s will differ depending on which one you’re on. What I’m going to do now is I’m going to go grab this ID integer here. This is the variant ID. I’m actually going to copy that, put that in my clipboard. Now I’m going to show you how to compose an email on how we would actually create this buy button for the reason and why we would need this variant ID.

[00:02:00] – Sending the Email

I’m going to go over to my email. I’m going to login and I’m going to create a new email here. I’m just going to send this to myself so we can see how it all works. This is variant ID test. You need here is the link to the bucket you will need for your website. Then I go 5 hour bucket and I go buy now. Now I want to create this link. I needed that variant ID in order to do that. What I’m going to do is I’m going to select this and I’m going to go to link. Then I’m going to put in my stored URL so http://www.sunbowl.ca/cart/variantid:1

If I wanted to do multiple variant ID, so say I wanted to actually put two products into the shopping cart for them, I could to a “,” and I can do it again. I could put this one and another one and it would add.
But for right now, we’re just going to do a single one. I’m going to hit “Okay” and then I’m going to hit “Thanks”, and then I’m going to send the email.

[00:03:00] – Result

Then when the email comes in, I can check it out and then, okay, I’m ready to buy this bucket. I hit “Buy” and it takes me straight to the checkout page and you can see there is the order. Then all the has more has to do is fill in there information and a way they go.

How to setup SEO keywords and descriptions in shopify

Posted on 19. Mar, 2014 in Getting Started, Uncategorized

How to add SEO descriptions and keywords to products, collections and pages within shopify. I walk you through all the different areas on how to update your SEO in the new shopify control panel.

Shopify makes minor update to admin Dashboard

Posted on 20. Feb, 2014 in About Shopify, Tweaks

Today shopify rolled out a minor update to the administration dashboard. This video will show you how to navigate the new design. There are no new features, just a minor redesign but it looks cleaner and improves the visibility of what matters.

301 Redirects in Shopify. Fixing broken links

Posted on 13. Feb, 2014 in About Shopify, Development, Tweaks

 

How to redirect old pages that no longer exist. Typically when you move from one platform to another the URL format changes. The best way to fix this problem is by using a 301 redirect. This type of redirect will notify google that the location has changed and the change is permanent. I will show you how to setup the 301 redirects through the shopfy dashboard.

Facebook Likes. Organic VS Paid

Posted on 11. Feb, 2014 in Social Media, Tweaks

This video was posted today and its creating quite a stir when it comes to Facebook advertising. I highly suggest you take a look and make your own decision, but from my point of view here is what I see.

The big question, is Facebook advertising a waste of money ?

The short answer is No, its not. The issue isn’t the ads, its the audience. This has been the issue with paid advertising since the beginning of time. Paid growth is always lower quality than organic. I like to compare it to being in school. If you pay people to be your friends, sure they will take your money and stand by you for a bit, but if the going gets tough. Say goodbye to those guys cause they will jump to the highest bidder. Although; if you work hard, build friendship, stand up for other people, take a few punches every now and again. Those friends will stick by you through thick and thin. Facebook likes are similar in this respect. You put yourself out there as a company and do a good job and your people will be knocking down the doors to associate with you. IE: Like your page. (Shameless plug)

So how does this relate to Facebook ads.

So if we stick to the premise that the audience is the issue then we can start doing some very creative targeting when it comes to our growth and using Facebook ads to do it. This is a similar issue that happens with google adwords. You could spend $10 per click on a very generic keyword which would result in a very low ROI and even lower bank balance; Or you could do your research, figure out your audience and buy the cheap keywords that will only result in 1 or 2 clicks but have a substantially higher result. Example: Shopify Expert. ( expensive ) vs Shopify website designer in vancouver. ( cheap )

So how do you do it.

Don’t make the mistake of buying a bunch of likes right off the bat with a generic ad campaign. The number of likes you have on your page does not value you as a business. Also it won’t help, and you probably won’t get you any new clients.

Instead stay focused, pick you keywords and audience. The graph on the side of Facebook audience that says you aren’t reaching enough people, you want it just high enough for them to run it, typically anywhere from 1000 – 10,000 people. The graphic is just a visual guide, it doesn’t do anything. read the numbers and don’t through good money after bad. Try small and see your result, if it works. Refine and grow slowly. Alternatively,  you can also use the upload a contact list module that will select you an audience based on your previous customer base, this is super powerful and accurate. It will allow you to connect directly with like minded clients.

The grain of salt.

I know the virtual cat page seemed like it was specific, but there is a lot of cat lovers out there. Based on what he said, I ran the same campaign and my audience was 24,000,000 people. In 24 million people, you are going to grab a few wildcards. ( 0.00015% ). Not that I’m disregarding his point, because it was a good example. However as an efficient online marketer, you would want to pick a more targeted audience.

I think in closing, I would like to share something that has served me pretty well.

Work on getting 100 amazing customers, not 1,000,000 shitty ones.

50 Ways to Make Your First Sale

Posted on 05. Feb, 2014 in Development, Ecommerce, Getting Started

Screen Shot 2014-02-05 at 11.57.34 AM

This morning I received an amazing resource from Shopify. This free ebook has dozens and dozens of great pieces of advice to help you get your store going. So good infact, I couldn’t just keep it for myself. Check it out Free Ebook