Searching...
- Home
- Video Lectures
- Official Website
Course
| Subject: | Web Design |
| Topic: | E-commerce |
| Views: | 12,039 |
Designing an eCommerce Portfolio With Sketch
Video Lectures
Displaying all 14 video lectures.
Lecture 1 Play Video |
Introduction Hi guys, I'm Adi Purdila. Welcome to a new tutorial series where you're going to learn how to design a minimal portfolio and eCommerce theme. Read more: http://webdesign.tutsplus.com/tutorials/designing-an-ecommer... |
Lecture 2 Play Video |
Overview The first step we have to take is to plan our website. What will it do? What's the purpose of it? We'll do that in this first lesson. |
Lecture 3 Play Video |
Header and Hero Our site header should provide the navigation. That's its main purpose. Of course, we do have the logo in there as well and since we're implementing shop components, we'll also add a reference to the cart. The hero section will show the latest theme or template and we'll have some big call-to-action buttons in there. So, let's go ahead and build these two sections. Read more: http://webdesign.tutsplus.com/tutorials/designing-an-ecommer... |
Lecture 4 Play Video |
Store Front & Testimonials The theme preview section will give the visitors a glimpse of some of the other themes. The testimonials will show quotes from people who have bought and used the themes. Let's begin. Read more: http://webdesign.tutsplus.com/tutorials/designing-an-ecommer... |
Lecture 5 Play Video |
Support and Footer Item support is an important aspect of our project. The people who buy your products expect you to provide assistance if something goes wrong. That's why we're making room for it on the homepage. Same goes for the team. We'll create a reference that will take the visitors to the about us page. The footer will be very simple as well. It will contain links to all the pages as well as a newsletter subscription form. Let's begin. Read more: http://webdesign.tutsplus.com/tutorials/designing-an-ecommer... |
Lecture 6 Play Video |
Index Page The shop index page is pretty straightforward. It will show all our products along with filtering, viewing and pagination options. Let's begin. Read more: http://webdesign.tutsplus.com/tutorials/designing-an-ecommer... |
Lecture 7 Play Video |
Category & Single Pages The category index page we'll be designing will show a list of all the categories along with an item count for each one. We'll also create a page that will display items from a specific category. Read more: http://webdesign.tutsplus.com/tutorials/designing-an-ecommer... |
Lecture 8 Play Video |
Single Page Description The content of our product or theme single page will be divided in three tabs: description, reviews and changelog. In this lesson we'll build the description part. Let's begin. Read more: http://webdesign.tutsplus.com/tutorials/designing-an-ecommer... |
Lecture 9 Play Video |
Reviews & Changelog The last two tabs in our product single page are reviews and changelog. They speak for themselves so let's jump right into it. Read more: http://webdesign.tutsplus.com/tutorials/designing-an-ecommer... |
Lecture 10 Play Video |
Shopping Cart Just like in any other eCommerce website, the cart will show a list of the products you wish to buy. Let's build ours using a simple table layout. Read more: http://webdesign.tutsplus.com/tutorials/designing-an-ecommer... |
Lecture 11 Play Video |
My Account Page The last page that's related to the shop component is the account page. Here, you'll be able to see your purchases and also edit the account details. Let's begin. |
Lecture 12 Play Video |
Interactions So far we've created the default states for our elements. But what about mouse hover? How do our buttons and links react to that? Well, let's find out. |
Lecture 13 Play Video |
All the Rest So far we've built probably the most important pages in our theme. There are a couple more we need to create: contact, support and about us. Let's jump right in. |
Lecture 14 Play Video |
Begin Checkout Let's start designing the checkout pages and I say pages because we have a few different scenarios. Let's start with the case where the user gets to checkout but isn't logged in. |
