{"id":793,"date":"2025-03-30T10:41:14","date_gmt":"2025-03-30T10:41:14","guid":{"rendered":"https:\/\/startersites.io\/blocksy\/web-studio\/?post_type=project&p=793"},"modified":"2025-11-04T16:05:11","modified_gmt":"2025-11-04T16:05:11","slug":"onshop-rs","status":"publish","type":"project","link":"https:\/\/djordjestojanovic.com\/en\/project\/onshop-rs\/","title":{"rendered":"OnShop.rs"},"content":{"rendered":"

OnShop is a modern online store specializing in printer toners and cartridges, successfully operating for over a year. The project began as a simple e-commerce platform designed to make purchasing printing supplies online easier, but over time it has developed into a comprehensive sales system with features that address the real needs of users and the market. Today, the store offers more than 1,400 products carefully organized by categories and printer models, allowing customers to quickly find the right product. The goal was to make the entire process \u2014 from product search to completing the order \u2014 as simple, clear, and visually appealing as possible.<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Design and user experience<\/h2>\n\n\n\n

The website is crafted in a minimalist style, with soft shades of pink dominating the background, creating a sense of lightness and order. Special attention has been given to readability, color harmony, and element layout. All components are carefully placed to provide users with an intuitive experience without unnecessary content.<\/p>\n\n\n\n

On the desktop version, a modern mega menu has been implemented, allowing easy navigation through the numerous product categories. The menu also includes sections such as Frequently Asked Questions, making them immediately accessible to customers without additional searching. When the menu is opened, a blur effect is applied to the background, focusing the user\u2019s attention solely on the category selection. Frequently Asked Questions<\/em>, which are immediately accessible to customers without the need for additional searching. When the menu opens, a background blur effect is activated, directing the user\u2019s attention solely to the category selection.<\/p>\n\n\n\n

Adapted for all devices<\/h2>\n\n\n\n

The website is fully responsive and adapted to all screen types. On mobile devices, navigation is further simplified. A two-layer popup menu has been implemented, which, in addition to standard categories, includes an integrated Google map showing the store\u2019s exact location. This allows users to immediately see where the store is and easily decide between in-person pickup and delivery. Another practical feature of the mobile version is the fixed \u201cCall\u201d button at the bottom of the screen, visible on all pages except during the checkout process. With a single tap, customers can call the store, further enhancing accessibility and trust.
<\/p>\n\n\n\n

\n
\"\"\n\t\t\t\n\t\t\t\t\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n\n\n\n
\"\"\n\t\t\t\n\t\t\t\t\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n\n\n\n
\"\"\n\t\t\t\n\t\t\t\t\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n\n\n\n
\"\"\n\t\t\t\n\t\t\t\t\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n<\/figure>\n\n\n\n

Checkout system and custom fields<\/h2>\n\n\n\n

The checkout process is designed to offer customers three simple options:<\/strong><\/p>\n\n\n\n

    \n
  1. Cash on delivery,<\/li>\n\n\n\n
  2. Payment via eBanking,<\/li>\n\n\n\n
  3. In-store pickup.<\/li>\n<\/ol>\n\n\n\n

    When a customer selects in-store pickup, the system automatically hides unnecessary fields such as address, city, and postal code, making the ordering process faster and simpler. An interactive Google map is displayed below, further easing location finding. In addition to standard information, custom checkout fields have been developed, allowing customers to specify whether they are purchasing as an individual or a business. Based on this choice, hidden fields such as tax ID, company name, or account type appear, preventing confusion and reducing the chance of errors.<\/p>\n\n\n\n

    \n
    \"\"\n\t\t\t\n\t\t\t\t\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n\n\n\n
    \"\"\n\t\t\t\n\t\t\t\t\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n<\/figure>\n\n\n\n

    Thank You Page and email confirmation<\/h2>\n\n\n\n

    After completing a purchase, the user is greeted by a specially designed Thank You page, structured to include all essential information without the need for scrolling \u2014 order number, date and time, a summary of items, and basic customer details. At the same time, the customer automatically receives an email confirmation of the successful order, featuring a minimalist design fully aligned with the website\u2019s visual identity.<\/p>\n\n\n\n

    \n
    \"\"\n\t\t\t\n\t\t\t\t\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n<\/figure>\n\n\n\n

    Conclusion<\/h2>\n\n\n\n

    OnShop is an example of a carefully planned and consistently executed e-commerce project, combining clean design, intuitive navigation, smart user flow adjustments, and a technically stable backend. The result is an online store that stands out visually while functioning quickly, simply, and efficiently \u2014 exactly as modern users expect.
    <\/p>","protected":false},"excerpt":{"rendered":"

    OnShop je moderna online prodavnica specijalizovana za prodaju tonera i kertrid\u017ea za \u0161tampa\u010de, koja uspe\u0161no posluje vi\u0161e od godinu dana. Projekat je zapo\u010det kao jednostavna e-commerce platforma namenjena lak\u0161oj online kupovini potro\u0161nog materijala za \u0161tampu, ali se vremenom razvio u ozbiljan prodajni sistem sa funkcionalnostima koje prate realne potrebe korisnika i tr\u017ei\u0161ta. Prodavnica danas broji […]<\/p>","protected":false},"author":1,"featured_media":6659,"parent":0,"comment_status":"open","ping_status":"closed","template":"","meta":{"_acf_changed":false,"footnotes":""},"project_category":[42,43,48,44,45],"class_list":["post-793","project","type-project","status-publish","has-post-thumbnail","hentry","project_category-brendiranje","project_category-dizajn","project_category-odrzavanje","project_category-razvoj","project_category-ui-ux"],"blocksy_meta":[],"acf":[],"_links":{"self":[{"href":"https:\/\/djordjestojanovic.com\/en\/wp-json\/wp\/v2\/project\/793","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/djordjestojanovic.com\/en\/wp-json\/wp\/v2\/project"}],"about":[{"href":"https:\/\/djordjestojanovic.com\/en\/wp-json\/wp\/v2\/types\/project"}],"author":[{"embeddable":true,"href":"https:\/\/djordjestojanovic.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/djordjestojanovic.com\/en\/wp-json\/wp\/v2\/comments?post=793"}],"version-history":[{"count":5,"href":"https:\/\/djordjestojanovic.com\/en\/wp-json\/wp\/v2\/project\/793\/revisions"}],"predecessor-version":[{"id":6710,"href":"https:\/\/djordjestojanovic.com\/en\/wp-json\/wp\/v2\/project\/793\/revisions\/6710"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/djordjestojanovic.com\/en\/wp-json\/wp\/v2\/media\/6659"}],"wp:attachment":[{"href":"https:\/\/djordjestojanovic.com\/en\/wp-json\/wp\/v2\/media?parent=793"}],"wp:term":[{"taxonomy":"project_category","embeddable":true,"href":"https:\/\/djordjestojanovic.com\/en\/wp-json\/wp\/v2\/project_category?post=793"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}