Do you know why online design tools are more and more popular? Online design tools allow non-professional users to design anything in the simplest way. Also, they can design anywhere and anytime. For this reason, there are more and more online design tools like Canva as Snappa, Crello, and Stancil,... How does your design tool compete with them? The key is different experiences. 

As an online design tool provider, Thirds Design realizes that its competitors are powerful, they need a differentiation strategy to be able to survive in this market. After a period of research and analysis, Thirds Design decided to develop a new feature: the design preview bar to improve users' experience.

Keep following the article, we will reveal to you how Thirds Design makes a difference with the design preview bar.

What Makes Design Preview Bar Special?


A design preview bar is a feature in software design tools, such as graphic design, UI design, or web design software, that allows the designer to see a live preview of the design they are creating, and make changes in real-time. The design preview bar is typically positioned at the top of the interface, and provides an interactive view of the design, enabling the designer to quickly see how changes to color, layout, typography, etc. will affect the overall look of the design. The purpose of the design preview bar is to make the design process more efficient and intuitive, by allowing designers to quickly see the results of their changes and make adjustments on-the-fly.

In addition, A design preview bar allows users to move to any other design with just 1 click. It is much faster and more convenient.

This is a completely new feature that the CMSmart team developed at the request of partners. We spent a week conceptualizing, designing, implementing, and perfecting. The design preview bar is a function that displays the entire design in the right menu bar. In case users design multiple templates, they can preview the templates in this bar.

The Benefits of a Design Preview Bar 

The first purpose that Thirdsdesign created the design preview bar feature was to help improve the user experience in the design, allowing users to have an overview of their designs. However, not only that, but the design preview bar also brings more benefits that will be analyzed shortly.


Real-time updates

Design preview bars allow designers to see the effects of their changes in real time. This means they can quickly experiment with different design options and instantly see how they impact the overall look and feel of their work. This can save time and help designers make more informed decisions about their designs.

Improved accuracy

With a design preview bar, designers can see a live preview of their work as they make changes. This can help them catch any errors or inconsistencies in their design before they finalize it. Additionally, designers can use the preview bar to zoom in and inspect their work in more detail, which can further improve accuracy.

Increased efficiency

A design preview bar can help designers work more efficiently by streamlining their workflow. Rather than switching between different tools or applications to see how their design changes impact the overall project, designers can use the preview bar to make adjustments in real time. This can save time and increase productivity.

Improved user experience

By providing a live preview of their design, a design preview bar can help designers create a more engaging and cohesive user experience. They can see how their design elements work together and make adjustments to ensure a seamless user experience. This can lead to a more polished final product that meets the needs of the end users.

Increased creativity

With a design preview bar, designers can experiment with different design options and quickly see the results. This can help spark new ideas and encourage more creative thinking. Additionally, designers can use the preview bar to try out different color schemes, fonts, and other design elements to create unique and visually appealing designs.

Overall, the design preview bar is a valuable tool for designers, as it helps to streamline the design process, improve the accuracy and efficiency of their work, and foster greater creativity and innovation in the design process.

From Idea To Practice

Introducing our partner Thirds Design


Established in Thailand, Thirds Design is growing and expanding in scale. After many business model transformations, Thirds Design decided to develop a model of providing online design tools.

Thirds Design provides online design services, including art products printed on clothes or objects and art products posted on social networks such as Facebook, Insta, and LinkedIn, ... or even create designs for online stores on e-commerce sites.

Thirds Design aims to develop into a professional design tool. Besides providing online printing services, It directs its development path like Canva - a professional online design tool.

However, now that there are many businesses that also offer online design services, in order for Thirds Design to stay ahead of the competition, they need something to help them stand out from the design tools. remaining. This is not easy, it requires a lot of investment in research as well as building a different strategy for their current website.

According to research on online design tools, users tend to design more than one version. However, if each customer page can only create a different design, it will create inconvenience in the user's design process. As a simple example, a customer wants to create a poster for a Facebook sales post, but she is confused between two concepts and decides to create two designs for these two concepts and then choose one of them. But if she has to create 2 designs on two different pages, and compare she will have to switch back and forth between the 2 pages, which is extremely time-consuming and inconvenient.

That's why Thirds Design wanted to create a feature that allows users to create multiple designs on one page and allows them to view designs in preview.

Development Process

Thirds Design talked to our developer about adding new features to their online design tool. Thirds Design wanted to create a feature that would allow users to create multiple designs on a single page. This will bring a lot more convenience to customers. So they came up with the idea to build a bar, this bar will display the entire design in order from top to bottom. It allows customers to view the entire design on one page and can jump to any design by clicking on the thumbnail on the sidebar.

The stately, it will idea was born when Thirds Design researchers realized that moving between multiple designs would make users feel uncomfortable and waste time. If there is a shortcut that allows them to jump to the design they want immediately much more convenient.

Received the request, our development team met and proceeded to design the Design preview bar feature. We put the bar on the right side so it can be easily seen by the user. Features designed to make it more convenient for users to use include: Shortcuts, Preview, Add a new page, Choose print page, and Download.

Preview: Users can view the entire design in this bar by scrolling down to see the designs below.


Add a new page: In case the user wants to add a new design, they just need to click on the “+ New page” Button. A new design page will appear right below.


Choose print pages: Maybe users create a lot of designs, but they only want to print one or a few images. So this feature allows them to choose to print a few desired designs out of the existing designs.


Shortcut: Users can quickly move to the print page they want, just click on the thumbnail of the design in the preview bar.


In addition, they can also hide the preview bar if they want thanks to the hide preview bar feature. When the preview feature is created, it will take up some space in the design. This can be frustrating for users if they don't need this preview bar. So our design team suggested adding the hide preview bar feature so that the client can hide the preview bar if they want.



It was surprising that both the CMSmart testing team and the Thirds Design team expressed interest in the solution developed by the dev team. Everyone thinks this feature will be the leading breakthrough in the web-to-print industry. It is also a breakthrough that helps to upgrade the customer experience to a new level, customers can create multiple designs on the same site, move to another design quickly, and choose from a few options. blueprints for printing,... There are many benefits that this feature can bring. We expect it to make Thirds Design sales explode when they announce the feature's launch.

Let CMSmart Help You Stand out From The Competition  

It is not difficult to predict the growth in traffic and conversion rates of Thirds Design when this business upgrades its design tool by adding new features. Although it is just a secondary feature, it helps to improve the user's design experience, making it more convenient for them to design. Just a simple feature but can also help Thirds Design make an impression in the eyes of customers.

If you can come up with an idea, we can make it a reality. Many of the available solutions cannot meet the needs of businesses. So we provide website development services on demand, and custom solutions according to your need. Do not hesitate to let us know your ideas, the best support is what we can do. Our team of experts with more than 10 years of experience is the person you can trust. And thousands of customers are satisfied and appreciate our services, I believe that you will also have a satisfied experience when working with CMSmart Team.

Feel free to receive a consultant from our expert by leaving comments or making a request. We will respond within 24 hours. 


Rose Helen

Shop Owner
Rose Helen is a highly accomplished Ecommerce Project Consultant with a strong background in managing and guiding successful e-commerce projects. With her exceptional expertise and strategic mindset, she helps businesses achieve their goals in the digital marketplace.
With years of experience, Rose Helen possesses an in-depth understanding of e-commerce platforms, technologies, and best practices. She works closely with clients to analyze their needs, develop tailored strategies, and execute effective project plans that drive growth and success.
As an Ecommerce Project Consultant, Rose Helen excels at overseeing project lifecycles, from inception to completion. She ensures projects are delivered on time, within budget, and with the highest level of quality. Her exceptional project management skills enable her to effectively communicate with stakeholders, manage resources, and mitigate risks throughout the project journey.
Rose Helen is a strategic thinker who leverages her extensive knowledge to identify opportunities for improvement and innovation. She provides valuable insights and recommendations to optimize e-commerce processes, enhance user experiences, and increase online sales.
With her strong communication and collaboration skills, Rose Helen builds strong relationships with clients and key stakeholders. She fosters a collaborative environment, working closely with cross-functional teams to ensure seamless project execution and alignment with business objectives.
Beyond her technical expertise, Rose Helen is dedicated to delivering exceptional client service. She goes above and beyond to understand her clients' unique requirements and provide them with personalized solutions that drive tangible results. Her commitment to client success is evident in her approach and the long-term relationships she builds.
Rose Helen's passion for e-commerce, coupled with her extensive experience and project management skills, makes her a valuable asset for organizations looking to thrive in the digital landscape. With her guidance, businesses can navigate the complexities of e-commerce projects and achieve their objectives with confidence and success.