1- Build Product Catalog in Lightspeed

2 - Understand Product Image Sizing

1- 'Building the Product Catalog' - Lightspeed Retail or eCom Support will be the best resource to help you through the Product Catalog creation and editing process within Lightspeed.

Having said that, we do have some advice for you as you build the Product Catalog. Make sure to consider the importance of 'meaningful descriptions' of at least 2 or 3 sentences, on each and every product.

The following article outlines the SEO advantage you will give your web store if you build out the product descriptions as outlined.

Article - How to Write Product Descriptions That Sell

Product Descriptions - The import tool for Lightspeed eCom is customer facing and has the fields for both short and long description. 

--

2- Sizing Images Correctly - AdVision is here to help and guide you on this process of sizing image, and we have the following suggestions from an eCom Development perspective for you.

Image Sizing - What you need to know.

When it comes to image sizing there is only one way to do it correctly and too many ways to get this wrong. We know that poorly sized or inconsistent image formatting will have a significant impact on the users experience (UX).

The following short movies will give you a basic understanding on the process of Image Sizing.

Movie - How to size Images & Why Sizing is so important

* If you have 100s or 1000's you need sized initially, you can ask us to size them for you. Just let me know how many and we can review and estimate that option for you. However, ultimately it is important you learn the process.

AdVision's - Recommended Sizing Guideline

During our meeting, we can decide on a format for your product images - Square, Horizontal or Vertical and you can then size as we recommend and upload the images into your Product Catalog.

Just do a few first and share back your results so we can confirm you are on track.

Here are the sizes we recommend....

Square - 1200 x 1200 | Horizontal - 1000 x 800 | Vertical - 800 x 1000 or for thin products such as bottles - 600 x 1000 |

* Sizes shown in pixels based @ 72 or 96 DPI, RGB - JPEG or PNG files continuous tone images, which a standard photograph. You should only use the GIF file format for halftone images, which are sold colors such as logos or artwork.

Formatting : You can choose more then one format for eg a category Bicycles may show better Horizontally vs Bike Accessories showing better as Square. If you do have different formats per categories, then ALL images in a given category should be the same format.

By sizing and formatting images correctly, this allows us to present to the visitor the experience of the images doubling in size as they browse page to page, example 300 x 300 Category Page, 600 x 600 Product Page, 1200 x 1200 Zoom.

We do not recommend having a 'hodge-podge' of sizes and formats loaded into your product catalog.

Summary : So PNG or JPEGS are ideal for your Product Catalog image you upload into Lightspeed, as outlined above and presently the only formats you can upload into Lightspeed.

But you will also be showing the visitor 'supporting images' as usually seen on the homepage, top of category pages, along side of the product images.

For those images, we have another file format we want you to save as. We recommended WebP image file format that is clearer, sharper and less file sizes then the product images (loads quicker).

• JPEG or PNG for Lightspeed Product Catalog Images

• WebP for all other 'Supporting Images'

--

How to Hold the Visitor's Attention, the secret is 'Consistency of Presentation'

AdVision's understands the influences of visual and functional elements within our eCommerce Web Stores, on Human browsing behavior.

Our Development Team, know that the Number 1 # Rule that will help extend the time someone browses on your Web Store is 'Consistency of Presentation'. This means that every page design and their elements, always should load the same size, place and shape as previous pages, with a degree of predictability and a comfortable flow for the 'eye', without having multiple elements competing and on a page for attention.

The Halo Effect of Perception, is a subconscious process your visitor experiences and transpires in under 120,000th of a second, each and every time they navigates through an eCommerce Web Store.

Example : Do I stay or do I go - am I interested or not - am I going to see, next, what I expect to see ? - are the primary questions, that are generally subconsciously assessed, prior to each 'click'.

To that point, Human Behavioral Science have determined that if the Web Store depicts 'Consistency of Presentation' - well balanced - that it will generally provide a positive feedback to the Visitor, each and every click.

During this process the Visitor essentially scores their browsing and is looking for a predictable Navigation in which they are experiencing an understandable design layout & easy to comprehend functionality.

This then categorizes within the Visitor - A Value Added Perception - of your company, that then establishes 'Trust'.

We hope you find these movies informative and invite you to suggest any techniques that you feel we have not covered that are important to you.

WHAT YOU WILL NEED TO PREPARE YOUR IMAGES FOR THE WEB STORE

PHOTO EDITING SOFTWARE

We recommend you have a copy of Photoshop. You do not need to purchase the newest CS suite versions of Photoshop, any older version Photoshop will suffice. We have some clients purchasing directly through Amazon in and around a $170.

If you are photographing your own products, you will need a camera that is capable of shooting Manual and in RAW format.

It will come with a RAW translator (software) and you will need to install the Photoshop 'plug-in' for this (instructions come with the camera) so that you can open up RAW images inside of Photoshop.

As you review the movies and comments below, you will need to understand ...

HOW THE LIGHTSPEED IMAGES AND THE ZOOM TOOL IMAGES WORK IN CONJUNCTION WITH EACH OTHER ON THE WEB STORE?

Generally when it comes to images for our projects, essentially we usually have the client prepare zoom images for example around 1000 x proportion (pixels) and then once you have all your zoom sized image in one folder on your Mac, we will have you duplicate the folder (APPLE D) containing all of those images and resize that new set down to 510 x proportion.

You then upload the 510 images into LightSpeed and then upload the 1000 images into the zoom tool module which we will give you access to once it is installed.

We recommend you remove all images you have in your LightSpeed POS if you are just getting started now on preparing images for your web store as we will need only the 510 image in LightSpeed.

When they do that, the thumbnail preview images regardless of the size that you see them on the web store will be coming from the LightSpeed images (the smaller ones) but when you click on that thumbnail and see the main product view picture and the corresponding zoom image (the larger ones) they are coming from the zoom module.

As you get started sizing and installing images we also recommend you do some initial tests first to see if it is all showing up as you are anticipating.

STEP 1

Size the Product/Zoom Images for the Zoom Module:

Once you have completed your photography and assuming you have shot in RAW format, you will need to now open those image(s) in PhotoShop in preparation to size them and save as a JPEG image.

There are a few movies to show you the whole process at the link below. Please continue to read in detail to present a full overview to you of the process.

AdVision will advise you during the development of your web store the final image sizes, based on the design of all images used to display your products — thumbnail, main and zoom — and therefore the sizes noted below are an approximate guide for you initially, until you are advised of the sizes we are using on your project. Check the main Project Panel in the collaborative to see if your web store's new images sizes have been posted.

Ideally you want to size 'down' your original RAW image(s) to about 840 to 1000 pixels @ 72dpi (dots per inch) for its widest dimension whether vertical or horizontal or square by it's proportion [meaning whatever mathematically sizing to 1000 pixels does to the other measurement].

All images on the web store must be set to 72dpi.

So in order of process — you will import your RAW image(s) into PhotoShop, you will make some adjustments when you are viewing the RAW translator that you will see during the import process and then once imported the image will open up in PhotoShop.

Once the image is in PhotoShop you will size the image to 1000 pixels by proportion and you will save the image as a JPEG using a filename convention (see link below) that is all lowercase, no spaces with the extension .jpg at the end of it.

Once you have done that and saved your image into a folder, you will then have accomplished the preparation the largest set of images of your products, used throughout the web store the zoom images.

These images will be seen on the main product view page as well as when clicked on to see the enlarged zoom image.

Note - please don't upload these images into LightSpeed POS, as they're too big and will slow the web store down, you will upload them to the zoom module (if installed on your project - see below).

STEP 2

Size images to a smaller size to install into your LightSpeed POS:

Let's assume that you have followed the instructions above and prepared your images to 1000 pixels by proportion and you now have them all sitting in a folder.

You need to do create a duplicate copy of the folder with your 1000px images and resize the images in the duplicate folder down to [510 pixels x proportion] and use theses smaller image to upload into LightSpeed POS through your product cards.

Note - click on folder and hit - Apple D to the duplicate folder and all files within.

Where do you upload the large images now

In LightSpeed POS, you will need to add 'one' product image for each product on the LightSpeed POS product card.

If you are using our zoom module for the web store, you only then need to upload 'one default image' into LightSpeed POS and not be concerned about any matrixes you may of already set up (colour and size) as you will add the matrix option images into our zoom module instead.

If your not using the zoom module, then you will need to upload 'all' images into LightSpeed POS at the 510 pixel size.

STEP 3

Log in to the Zoom Module and upload the larger images you prepared:

Assuming your are having the zoom module installed, you should have a folder containing the 1000 pixel set of images and you will be able to upload them through the zoom tool module once installed (we will advise you when), by going to the URL of your web store and adding at the end of it...

/modules/admin/login.php

...so it should look like this for example...

http://shop.yoururl.com/modules/admin/login.php

...you should then be presented with a username and login panel and initially you can use...

admin / pass

..initially as the user and password [tell us whether you want this changed asap].

Once logged in you will be able to see your LightSpeed database is reading all of your products in a list view for your reference.

Clicking on any one product will take you to the page that allows you to upload the image(s) to associate to that product.

By doing so you will have uploaded the zoom image which will also be the main product image seen throughout the web store and the zoom image enlargement when selected.

The thumbnail images that you see throughout the web store are generated from the LightSpeed POS, even though they appear smaller then 510 pixels.

STEP 4

Log in to your LightSpeed POS and upload only ONE image per product as the default image at the 510 pixel size:

Finally you will need to install the 510 sized images into LightSpeed POS [not the zoom module] and then upload your products to the web store to see your thumbnail images.

Summary - you have to upload the half sized images (510) into LightSpeed POS to see the thumbnails images on the web store as well as the images you see in your POS at your location. Make sure you don't have any images in your LightSpeed POS that are larger, as they will slow your web store down.

You then need to upload the larger (1000) images into the zoom module to see the 'main product images and the subsequent zoom image' on the web store.

What You Will Need to Shoot Your Own Photography

ROOM : A room available to you that you can set up and is at least 10' x 8' average size. It is preferred that you can you leave your equipment set up in this room untouched for few days or so rather then tear down each time you photograph.

CAMERA : Have a camera that is capable of shooting fully Manual and in RAW format.

BACKDROP : For your background (white or grey usually) you need a 9' or 4.5' foot wide seamless role of white paper, available through professional photographic supplies stores, costs around $75 and is 9' x 100' usually. You are free to decide on any type of background.

You will need to have a way of mounting it 'high' up against one wall such as two light stands or brackets.

Take your seamless roll of paper and through the center cardboard sleeve, you put a 'pole' through so that it sticks out a few inches on either side and you can then clamp on the light stands or hang on brackets.

LIGHTING : In regards to lighting, there are many small portable studio lighting setups that are reasonably inexpensive (around $500.00) - http://www.bhphotovideo.com (click on Lighting & Studio).

When it comes to the type of light that you wish to use, they are generally classified as compact fluorescent, incandescent or flash. If you are going to use live models, then you need to go with flash lighting. If you are going to set up on a mannequin or table top, then we would recommend compact fluorescent lighting (not incandescent).

You will need 3 lights, two will light the background to make it as light or as dark as you wish, and one light in the front will light the product.

For the background two lights, they should have open reflectors and barn doors.

For the front single light, it should either be an 'umbrella' or 'soft box'.

*** All lights need to be of the same type. ***

Photographing Your Products - Setup & Lighting Techniques

We have assembled and/or produced ourselves a series of short movies that you can reference to help guide and teach you photographic techniques along with how to prepare your photographic images in Photoshop/Automotor and create a professionally consistent and polished presentation of your products.

We hope you enjoy these very informative movies and invite you to suggest any techniques that you feel we have not covered that are important to you.