{"id":95,"date":"2024-08-02T05:58:07","date_gmt":"2024-08-02T05:58:07","guid":{"rendered":"http:\/\/localhost\/portfolio\/?p=95"},"modified":"2025-02-25T23:20:12","modified_gmt":"2025-02-25T21:20:12","slug":"obenauf","status":"publish","type":"post","link":"https:\/\/matejhorvatic.com\/en\/obenauf\/","title":{"rendered":"Oben-Auf Roofing Systems"},"content":{"rendered":"
\n\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t

Oben-Auf Roofing Systems<\/h1>\t\t\t\t<\/div>\n\t\t
\n\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t

Company with a long-standing tradition is ranked among the leading ones in Slovenia, providing its customers with a wide range of roofing materials.<\/p>

One of the cornerstones of their operations is the satisfaction of B2B customers, who are vital on the path to successful business development.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t

\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t

Role<\/b>
UX\/UI Design<\/p>

Employment<\/b>
Dspot d. o. o.<\/p>

Year<\/b>
2023<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t

\n\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t<\/path><\/svg>\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\tVisit Site<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t
\n\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\"Oben\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t
\n\t\t\t\t\t
\n\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t
Starting Point<\/h5>

As the number of business partners grew, the client wanted to upgrade the website in two ways \u2013 the main site would function as a digital catalogue of the entire range of products, and at the same time establish a B2B portal for their business partners.<\/p>

The portal would greatly ease the filed work, as they could now order materials, check and track orders anywhere, anytime and generally manage pending matters easily.<\/p>

The overall redesign of the website and the layout of the portal had to be in line with the existing graphic design guidelines and have a good user experience, reflecting the client's values and business practices. The competing examples were significantly outdated, both technologically and in terms of user experience - the main drawback, for example, was the lack of responsive display on different devices.<\/p>

\u00a0<\/p>

Design Process<\/h5>

During the meetings I got to know the client's activities, product range and their users. In the end we came to the conclusion that regular visitors should be provided with key information, such as contact details, enquiries, etc., and new visitors should be invited to explore the site and get in touch. Using user scenarios and several iterations of wireframes, I came up with a basic prototype, which was then adapted further, according to the actual data, until we achieved our goals - one of which is to personalise the offer in the business portal according to the needs and preferences of the customer.<\/p>

Visitors of the main page are guided through the presentation and the key product and service categories, and invited to become business partners - thus gaining access to the business portal and additional business benefits such as seminars, lectures, etc.<\/p>

The client wished to incorporate the orange line (which is one of the more distinctive elements of their printed materials in the client's distinctive orange colour). I animated it and used it as a trigger to guide the visitor\u2019s eye and explore the site, rather than a purely aesthetic element.<\/p>

As a UX\/UI designer, I wrote the design brief, then by using competition and best practice research, wireframes and prototypes, came up with the final design. In doing so, it was necessary to critically evaluate ones assumptions at several points and come up with appropriate solutions. Throughout the planning and design phases, I also worked closely with the front-end team to ensure a consistent implementation of the design and adjusted the various elements accordingly.<\/strong><\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t

\n\t\t\t\t\t
\n\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\"\"\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\"\"\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\"\"\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\"\"\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\"\"\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t
\n\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t
\n\t\t\t\n\t\t\t\t\t\t<\/span>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t
\n\t\t\t\t\t\t\t
\n\t\t\t
\n\t\t\t\t< Prej\u0161nji<\/span>FIHO Slovenia<\/span><\/span><\/a>\t\t\t<\/div>\n\t\t\t\t\t\t
\n\t\t\t\tNaslednji ><\/span>Vila Robida<\/span><\/span><\/a>\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>","protected":false},"excerpt":{"rendered":"

Website and B2B store<\/p>","protected":false},"author":1,"featured_media":43,"comment_status":"closed","ping_status":"open","sticky":false,"template":"elementor_header_footer","format":"standard","meta":{"iawp_total_views":18,"footnotes":""},"categories":[1],"tags":[],"class_list":["post-95","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-uncategorized"],"_links":{"self":[{"href":"https:\/\/matejhorvatic.com\/en\/wp-json\/wp\/v2\/posts\/95","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/matejhorvatic.com\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/matejhorvatic.com\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/matejhorvatic.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/matejhorvatic.com\/en\/wp-json\/wp\/v2\/comments?post=95"}],"version-history":[{"count":97,"href":"https:\/\/matejhorvatic.com\/en\/wp-json\/wp\/v2\/posts\/95\/revisions"}],"predecessor-version":[{"id":1393,"href":"https:\/\/matejhorvatic.com\/en\/wp-json\/wp\/v2\/posts\/95\/revisions\/1393"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/matejhorvatic.com\/en\/wp-json\/wp\/v2\/media\/43"}],"wp:attachment":[{"href":"https:\/\/matejhorvatic.com\/en\/wp-json\/wp\/v2\/media?parent=95"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/matejhorvatic.com\/en\/wp-json\/wp\/v2\/categories?post=95"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/matejhorvatic.com\/en\/wp-json\/wp\/v2\/tags?post=95"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}