Website prototype for the Sampola Work Center

In autumn 2024 I took part in a Häme University of Applied Sciences Design Factory Project course, where we implemented a website prototype over the course of a month for Sampola Work Center. I was responsible for the logo and user interface design in the project and led the process of making the WordPress prototype.

Työkeskus Sampolan prototyypin Koti-sivun hero section

During the Design Factory Project course, each group participating in the course created their own solution for how to improve the online visibility and sales of Work Center Sampola. Work Center Sampola's own specific wish was to renew their homepage and online store in a more modern direction, as the old site no longer served their needs.

Työkeskus Sampola värit ja fontit
Työkeskus Sampola logo prototyyppi

New and Improved Logo

There were a few people in our group who were designing new logos for the Sampola Work Center. However, we ultimately ended up using the logo I designed, which would be easy to use in all electronic materials and also printed on clothing, for example. The logo has a minimalist look, but still feels relaxed and modern.

Something New and Something Old

The renewal of the Sampola Work Center website started with a search for information, after which I started designing the user interface plan. The user interface plan utilized, among other things, the color scheme and photographs of Sampola Work Center's previous websites, as well as Sampola Work Center's social media material. One of the biggest problems with the previous site had been confusion and difficult usability, so clarity and ease of use were the driving force behind the user interface plan. The accessibility of the site was also one of the important criteria, and its implementation was tested already during the user interface design phase using various Figma accessibility plugins.

Työkeskus Sampolan sivustoprototyypin etusivu

WordPress & WooCommerce

After the user interface design was completed, we built the final website prototype using WordPress. The website was made responsive and its accessibility features were as close as possible to the WCAG 2.2 guidelines. We used, among other things, Gutenberg, WordPress' own block editor, and the Spectra One theme to build the website. We also added a WooCommerce online store to the website. The speed of the website and online store was improved, among other things, with caching and image size optimization plugins.

Request a WordPress Website Quote Today!

Piirros kädestä, joka pitelee viestin saanutta kännykkää | Jon Haataja verkkosivut