EASY SCREEN
Online orders management website
UI / Web design
2015
Senior designer at STG
About EASY SCREEN
EASY SCREEN provides a unique range of products and brands for tradeshows, Mobile Presentation Systems, Events, and Display. The company design and supply display products for long-term use such as Rollups, Counters, Tents, Exhibition support, Flags, Outdoor Equipment, for operations in Europe, Africa, and America.
The project
Create a website that enables EASY SCREEN customers to place orders online while making their porches process easy. EASY SCREEN offers its customers a big selection of products, each product has different variables and lots of technical information (materials, videos, images, assembly instructions, etc). Therefore Our key focus was on how to present the products. Our challenge was to present complex products in a simple way and making their porches process easy.
Our user
The vast majority of our users are returning customers with a professionals background, they are goal-oriented, and they are here to complete an order.
Therefore on the welcome page, I highlighted with color and position the buttons for signing in or register, and locate the 'scroll down as a guest' at the bottom of the page.
Home Page
After Defining our users we decided to design the home page without a fancy header image or an about section, Just the product categories.
Two in one
Category page + Product page
Next In hierarchy came the single category page, usually followed by the product page. Here we changed the flow to create a better process. We combined them both into one. The products were arranged like thumbnails but they contained all the information about the product and all the actions the user needs to do. This way we saved a click and shortened the process
Gust product preview
The differences between
gust user and logged in users
-
Registered users can view prices.
-
Registered users can add products to the cart.
-
Registered users can see more information about products.
logged in product preview
EASY SCREEN, easy access
The shopping cart
As I machined Only a logged-in user can see products and make an order.
We wanted to give those users an easy way to open the cart at any time and edit the products in it including their different variables. This was important because of the high number of changes a user makes during the order and the complexity of the products information.
So we used a cart tub to follow the user left side of the web pages, click on it opens the cart preview with all the editing options. My UI challenge was to squiz in all this information and buttons in the limited screen space.
Cart preview
All Products in the cart are in accordion display.
When clicking on the 'edit' button it opens and reveals the different product variables like size or finishes.
The user can edit them separately, remove one of them, or move to trash the howl product.
Repeating the system
After creating the cart preview we applied it to the cart itself with a full-screen display. In addition to the regular cart, we had a screen of former orders, so we used the same editing system on this page as well.
Accordion > Click edit button > Opens variables > Edit > Done
