Usability & Design - How design influences the success of online stores
Tuesday, October 27, 2020

Usability & Design - How design influences the success of online stores

Usability is an essential part of a good offer or experience. You can have the most eye-catching designs and a smart user interface, but if the user experience is poor, your visitors will encounter problems that could (and probably will) cause them to choose other vendors.

Let's say you visit a store where the overall user experience is simply terrible. Would you go back to that store or website? Would you make an initial order at all? Probably not. At least not without serious doubts.

If you neglect user experience and design, you will probably end up with a result that people will not use - which is far from ideal.

So don't be afraid to ask the tricky questions and make sure that your product is actually usable by the users.

UX Design: Understanding what matters

The new Smartstore CMS Page Builder is the ultimate tool for the creation of captivating websites without any programming experience.

  • Take control of your content and create effective content that takes customers on an emotional journey of discovery through the store to create maximum buying appeal.
  • No HTML or CSS knowledge required. In terms of operation, design and flexibility, the WYSIWYG editor leaves nothing to be desired and sets absolute standards in your creative freedom.
  • Fully integrated into Smartstore. The integration into the store system promises the simplest content management for a perfect combination between emotional storytelling and the offer.

Turn your customers shopping into an impressive experience

The new Smartstore CMS Page Builder allows you to create fascinating content from products, product groups, images, videos and text. Design elements such as animations, transitions, color gradients, hover effects, overlays and operation via the WYSIWYG editor leave nothing to be desired in terms of design and flexibility.

  • State-of-the-art technology: On the end device, the Page Builder uses the ingenious CSS grid layout function. Compared to a proprietary grid system, the CSS grid offers significant performance and design advantages. The editor in the backend maps almost all CSS grid functions.
  • Customizes every theme: Focus on the content. The rest is done by the Page Builder, which harmonizes perfectly with each theme by cleverly integrating colors, typography and other theme parameters.
  • All languages, all stores: You can of course maintain all text content in all languages activated in the store. And of course, in multi-store operation, the sites can be varied depending on the store.
  • Carefree updates: Carefree updates: Unlike theme changes or fully custom themes, content created with Page Builder is always migrated automatically when program updates are made. One of the most outstanding features of the Page Builder CMS system for Smartstore is the automatic adaptation of new theme properties such as colors and fonts to existing Page Builder content.
  • Powerful grid system: Design a grid on which your content will be placed later. Specify the number of columns and rows and the cell spacing. Column width and row height can be set individually for each cell.
  • Extensive content library: Drag content blocks from the library into the grid. Each block can be placed anywhere in the grid and can span any number of columns and rows. Blocks can also overlap, giving you maximum creative freedom.
  • Responsive design and one story for all end devices: Easily switch between all viewports - such as smartphone, tablet, desktop - with the slider and adjust the block arrangement for each viewport separately if needed; so your story always looks perfect on any device and on any screen resolution.
  • Select target pages via menu: Simply define one or even more target pages on which your stories should be displayed. You can also specify the exact placement per widget zone and define publication periods.

Create impressive effects with just one click, such as background parallax effects

  • Parallax Scrolling: Simulates spatiality or movement for background images or entire content blocks.
  • Reveal: Hides a block when the page is loaded and shows it only when scrolling with an effect.
  • Hover: Raises a block
  • Scale: enlarges a block
  • Overlays: Color masks for background images: Uni-colors, as shading or as gradient. With options for intensity, size and direction.
  • Tint: Changes the transparency of background overlays on mouse hover.
  • Shadows, borders and radius: With options for color, size and intensity.
  • Flat Boxes: Enables background, borders and shadows only when the mouse is moved.
  • Megasizing: Enlarges a block so that it overlaps other blocks or protrudes from the screen.

The "Smartstore CMS Page Builder" plugin is a proprietary development of Smartstore AG for the Smartstore e-commerce software and is available via Smartstore Marketplace.

Do you have any questions about the "Smartstore CMS Page Builder" plugin or would you like to give us feedback? You can reach us via the contact form, by e-mail at or by phone from Monday to Friday between 10 a.m. and 4 p.m. at +49 231 5335 0.
Leave your comment