{"id":1458,"date":"2021-08-24T08:43:08","date_gmt":"2021-08-24T08:43:08","guid":{"rendered":"https:\/\/shuffle.dev\/blog\/?p=1458"},"modified":"2021-08-24T08:44:00","modified_gmt":"2021-08-24T08:44:00","slug":"yofte-vs-tailwind-ui-e-commerce-what-are-the-differences","status":"publish","type":"post","link":"https:\/\/shuffle.dev\/blog\/2021\/08\/yofte-vs-tailwind-ui-e-commerce-what-are-the-differences\/","title":{"rendered":"Yofte vs Tailwind UI E-commerce – what are the differences?"},"content":{"rendered":"\n

From this article, you will learn what are the differences between Yofte E-commerce UI Library and Tailwind UI E-Commerce. <\/p>\n\n\n\n

Tailwind UI E-commerce is the latest addition to Tailwind UI. If you haven’t purchased it yet, you can do so here<\/a>. It is a great set of components for building e-commerce.<\/p>\n\n\n\n

So why did we create Yofte if Tailwind UI is great?<\/h2>\n\n\n\n

Tailwind UI gives you everything you need to create a store, but its minimalist style won’t please every single customer<\/strong>. <\/p>\n\n\n\n

In Shuffle Editor we try to give our users many possible choices<\/strong> when starting a new project. Both in terms of the layout of individual components and the style of the new site. <\/p>\n\n\n\n

Tailwind UI has a specific (and very nice!) vision for the store. To change it, you will have to put in a lot of work. <\/strong>Not every project has the budget for that. Even if it does, it won’t be the ideal start for every project – sometimes aesthetic choices will suggest a different direction.<\/p>\n\n\n\n

At Yofte E-commerce UI Library, we approached creating the perfect store in a slightly different way. Namely, we didn’t want to copy Tailwind UI (by the way, both libraries were created at the same time), but create a store template with a distinct aesthetic profile<\/strong>. And that’s exactly what Yofte is.<\/p>\n\n\n\n

Is it even possible to create such a UI library? After all, nowadays all online stores are very similar to each other!<\/h2>\n\n\n\n

This is where I give the floor to our designers. Pat W\u0105sik<\/a>, our Chief Product Officer along with Yofte’s designer, Mat Jakubowski<\/a> really put a lot of heart into making Yofte different while allowing for further modifications for a specific implementation:<\/p>\n\n\n\n

Exactly right, design uniformity is a growing trend<\/strong> in the last 10 years. This is due to two reasons, the ease of using ready-made templates and technological<\/strong> unification by the popularization of certain frameworks and CMS – like WordPress, Shopify, etc.The website templates created for them are adaptations of the required elements. And since they all use the same starting point, the end result can’t be too diverse\u2026<\/p><\/blockquote>\n\n\n\n

\"\"
Graph describing homogenization of web design from from ongoing research at Indiana University <\/a><\/figcaption><\/figure>\n\n\n\n

The second reason is the functionality of the adopted solutions.<\/strong> If they work for the big players, why shouldn’t they work for me? And who am I to question it? A single designer, or even a team, will not question the research of multiple UX teams based on the results. Even in large and original stores, layout changes are usually minimal and incremental, watched very closely by marketing teams.<\/p><\/blockquote>\n\n\n\n

So in creating Yofte, we tried to find the golden mean between these approaches. The components we build have distinctive and bold elements where there is room and opportunity.<\/strong> On the other hand, where there is a consensus that a certain solution is simply more useful (which translates into more conversions), there we didn’t tear down the patterns known to users.<\/p><\/blockquote>\n\n\n\n

From my marketing perspective, I would add that another reason is the pressure on the result. The store has to sell, the website has to attract customers.<\/strong> To do this, it must be fast and perfectly responsive. In such conditions, looking for an attractive and different design is difficult. You need to find a brave designer, a talented developer who will code something beyond standard components in a good way, and first of all defend the idea before the board. <\/p>\n\n\n\n

At Shuffle we try to find the middle ground. We give you a choice of many designs <\/strong>(both standard and a bit more crazy), as well as the possibility to create the first versions of the site very easily in our drag and drop editor. <\/strong><\/p>\n\n\n\n

This way you can quickly modify the first version you build – fill it with content, add images, change styles. For many projects this will already be what you are looking for. In addition, it will be much faster than if you do it the classic way.<\/p>\n\n\n\n

For others, we will go a step further. The time saved will allow you to edit the code under the components, adjusting them to your vision. <\/strong>We pay a lot of attention to keeping the code under our components clean and understandable so as not to hinder your work. You can do it either from the editor (which we are still improving!) or from your favorite IDE. We even created a plugin for Visual Studio Code<\/a>.<\/p>\n\n\n\n

How Yofte looks like – component preview<\/h2>\n\n\n\n

We are putting the final touches on the library, so there may be some differences in the final version.<\/p>\n\n\n\n