KISS (Keep It Simple Stupid) Principle

If you build an overseas shopping mall using Shopify, WordPress, or Magento, you will set the design using a theme. After selecting a theme style, you set up the design in the order of replacing the actual products to be sold, slides, and banner images. In this process, if there is no clear plan or concept, the design can become disorganized. In this post, we will look at what elements are needed to maintain a sense of unity and learn about overseas shopping mall design settings that can make your brand stand out.

stereotypical title

The title, which is the product name used in shopping malls, is one of the most important elements in search engine optimization (SEO). Titles must be composed based on keywords and must create and use site-specific rules. You must avoid the "Title/Keyword 1/Keyword 2/Keyword 3/Keyword 4" format that is often seen on domestic Gmarket or eBay. If there are keywords that must be added in addition to the title, please add them through the description (product description) or tags. The general title format is brand + product name + specifications, and the brand can be added to the brand session in addition to the title, so if the product is manufactured directly, the brand does not need to be listed in the title.

Image suitable for shopping malls

80% of shopping mall design is photography. Photos can be divided into product images and banner images. When you study the design of overseas shopping malls, you can feel the difference between overseas and domestic shopping malls in the photos. While overseas shopping malls mostly use product-oriented photos, domestic ones often use model-oriented shots. This part is more noticeable in fashion and beauty products. As Soho Malls such as Style Nanda are leading the domestic shopping mall trend, the design of fashion shopping malls appears to have been formatted. This design format created star models and solidified the model-oriented format. Model-centered design can be positive in Southeast Asia, where Korean Wave culture is popular. However, if you are targeting North America and Europe, it is advisable from a design perspective to use a product photo as the main product image. Amazon and other marketplaces also require product images with a white background as representative images, so resources can be reduced when linking product listings in the future.

​Have you ever seen blurry images while surfing the web? Blurry images are a phenomenon that occurs due to lack of image optimization. If you are creating a slide image or banner image, you must use a 1024px image or, in the case of Shopify, a 2048px image, which is the maximum image size, to provide a clear image. Most themes provide a function that automatically adjusts the size by uploading only high-quality images to their section, so if you are creating a slide image, we recommend that you upload high-quality images. Additionally, product images must be of the same size. An automatic resizing function is provided for product images, but for a unified design, it is recommended to use images of the same size.

▲ Product image of a certain size

Select main color

Other than images (photos), the element that determines the site concept is the main color of the shopping mall. Color is an important element that shows the design concept of a site along with the brand logo. The basic rule is to use 2 to 3 colors excluding black and white. The main color is used for bar banners and main slide headers, and the sub color is used for CTA buttons, footers, and other banner images. The easiest way to choose a color that creates unity is to choose the main color according to the logo color. Even if you use only the logo and main color, you can maintain a sense of unity in the shopping mall. Once you have decided on the main color, you can save the color code for that color and use it commonly in emails or flyers sent from shopping malls.

▲ Color code

• #FFFFFF - White
• #2D2D2D - Dark Gray
• #50B83C - Green

Use 3 or fewer fonts

The most important factor in choosing a font is readability. No matter how well-designed a font is, if it has poor readability, you should avoid using it. Additionally, excessive use of fonts can be detrimental to design. Don't forget that you should use three or fewer fonts to maintain a sense of unity. If you use font families, you can create a more balanced design. Of course, fonts must also be used in the same size.

▲ E-book design using the open sans font family (source: canva)

▲ Banner design example using font family

Themes provided by most shopping mall builders, including Shopify, are linked with external fonts such as Google Fonts in addition to the fonts provided by the theme, so font conversion is possible with a simple setting without coding. However, as the saying goes, less is more, so please refrain from using excessive fonts to maintain clean design and readability.

_
You can maintain a sense of unity by just organizing the titles, images, colors, and fonts mentioned above. However, since the main character of a shopping mall is the product, the design should be designed to focus on the product, avoiding excessive color selection or complicated design. We hope you will create the foundation of your shopping mall branding with these four elements.