From this week on, I plan to recommend some websites with good experience or special designs from time to time. As we all know, nothing is perfect. Thus while talking about why I like the site, I would also like to point out where to improve. Hope you will enjoy the dish I’m going to serve!
I came through the Gumroad site while I was doing my research for another article, which you are going to read about on my blog soon. Gumroad is a platform of offering online selling service for creative people. Users can either put up their physical products, or upload digital format creations for sell.
- What I like -
Login and Register form transformation
This is the first thing that impressed me when I started to explore Gumroad. Unlike most sites using two different pages for login and register, Gumroad combined those two together using an overlay, which makes the transition much smoother. Users may enter the login overlay first, but by clicking on the link at bottom, they can change the view to register without losing any of the information that they may have inputted already.
Connection with Physical World
One significant design concept in Gumroad is building a connection to the real world. Nowadays we see neat and clean flat design everywhere, but it doesn’t mean realism design is out of date. For me, I found it’s kind of fresh to see the realism designs came back to life and been made a perfect combination with flat design.
When you dive into the website and start to fill some forms, you will see the credit card form was actually designed like a physical credit card, address input fields were been displayed on an envelope, and when client check out, they will receive a slip which looks exactly the same as the one you may get from any physical stores. The advantage of adapting realism design is less time and effort in educating the users. Besides, compare to a normal form design, this is much more fun!
Educate Users through a 30 Day Challenge Campaign
Gumroad offered a guidance for users to discover and build their audiences. The method is simple: getting them involved in a 30 Day Challenge Campaign. This reminds me of the app called Monny, in which users can choose to join a 7-day or 30-day challenge of accounting. It is a smart way of educating and engaging users, which would gradually help build their habit of using a product.
The calendar design within the 30 Day Challenge is also interesting. By clicking on any of the dates, the selected fields expand to show details and push the other fields to the side at the same time. This is an interesting interaction that can possibly be adopted into some similar designs, such as event calendar.
Experience Your Customers’ Journey
Another notable feature is, users will be able to go through their customers’ journey while decorating the product info page. Through step by step instruction, users can see what the customers will see, experience what the customers to experience. Good thing about this design is to provide a chance for users to think from their customers’ perspective, it is a helpful way of producing better content.
- What I dislike -
Unclear Navigation Indication
Though uploading products processes are quite fluent within the customer dashboard, I have to say, it's not easy to get around on their public website. This issue is mainly due the position of placing the website logo. Nowadays most users understand that the site logo can be used as a home button, thus it is totally understandable that fewer websites kept the home tab. However, even though the size and logo can be adaptive, I still believe that the position of home icon should always be consistent across the whole experience, otherwise your users may easily get lost while browsing your site.
One example about this issue is: On homepage the logo is on the left hand side with a gap to the edge, however, on the sample product page, the logo is very close to the edge of this page. While scrolling down, menu on the bottom moved up and floated on the top, which means if you want to go back to the homepage, you will have to scroll to the top to click on the logo icon from there.
Two scrollable sections on one page
To be honest, I’m not a big fan of multiple scrollable sections within one visible areas on the screen, especially when this is been applied for a website. There is a high risk of breaking links between those scrollable sections, thus when design pages like this, we need to specifically think about what’s the purpose of creating a design like this, and how do those sections work together.
To sum up, Gumroad is a pretty simple and straight forward website, which made it easy to understand their goal and mission. After deeply studied it, I found there are lots of adorable little detail designs in the site that I would like to put into my library for future use. And the most highlighted take away I got from them is about designing forms in a more efficient and fun way.