We design online shops, partner portals, configurators and apps for medium-sized and large companies. We start with what people need to get done with you, and finish with files where developers find an answer to every “what if…”.
01 / 05 Overmax Product page on a phone See the project
01UX and UI
We write them together, with a slash, because one doesn't work without the other. The most convenient path loses to a button nobody noticed, and the prettiest button won't help if it leads nowhere.
User experience, or how using the product feels
Everything a person goes through when using a product. Do they quickly find what they came for, do they understand what will happen when they click, and do they reach their goal without phoning your office?
Answers the questions
What comes out of it
User interface, or everything on the screen
Everything you see on screen and touch: buttons, fields, colours, typeface, icons, spacing and motion. A good interface shows straight away what matters most, what can be clicked and whose product it is.
Answers the questions
What comes out of it
02From UX to UI
Take a product page in a lamp shop. Before anyone buys, they ask themselves five questions. UX decides where and in what order they find the answers, and UI gives those answers their form.
Before we draw anything, we collect the questions customers ask themselves before buying and put them in the order they come to mind.
Each question gets its own place on the screen. There are no colours yet, and that's deliberate, because at this stage the only topic is whether someone can buy a lamp here.
The same places get the brand colours, typeface, photos and motion. The most important button stands out from a distance, and nothing else gets in its way.
Lighting above a table
Dome pendant lamp
PLN 649
Ships tomorrow
“Is this the right lamp?”
UX decides
Photo and name right at the top. Customers first check that they've come to the right place.
UI shows
A large photo on a light background and the name in the brand typeface. More photos with a swipe.
“Does it come in my colour?”
UX decides
Colours just below the name, because they decide whether the customer reads on.
UI shows
Swatches in circles, the selected one outlined. The shade in the photo changes colour with the choice.
“Will it fit above the table?”
UX decides
The dimensions customers check with a tape measure in hand: shade diameter and drop length.
UI shows
A small dimension drawing, legible without zooming in.
“How much is it, and when will it arrive?”
UX decides
Price and delivery side by side, because customers decide on both at once.
UI shows
The price in the largest type size, with the delivery date next to it and an icon.
“How do I order it?”
UX decides
One main button within thumb's reach. A question to the shop as a second, quieter option.
UI shows
A button in the accent colour near the bottom edge. Tapping it confirms that the lamp is in the basket.
In practice
That's how we started the Overmax shop. Most customers browse it on their phones, and the model page matters most to them, so we built the concept on the mobile page for the X-Hooligan and only then the rest of the shop on top of it.
See the Overmax project
03Approach
Obvious to the customer who sees it for the first time, and to the developer who will build it.
We listen to the people who will use the product, and to those who take their calls today. Customer service knows more about an interface than many a report.
We map out where people come from, what they want to get done and where they give up today. Every screen gets its place along that path.
We arrange content and features in the order people make decisions. In the Biurokoncept shop, three routes lead to the range: by spaces, products and services.
Grey rectangles with real content come first. A wireframe is the cheapest place to move a button, add a step or cut a feature nobody needs.
When a brand promises something, the interface has to keep that promise. We take the colours, typeface, icons and tone of messages from the brand and test them on screen. In the dark Overmax shop the main blue turned out to be too dark, so we used a lighter one from the car range.
We write buttons, messages and hints, in other words UX writing. “Send enquiry” says more than “Next”, and a good error message tells you how to fix the problem.
We check contrast, text size, keyboard navigation and screen reader descriptions in every project. Interfaces are also used by people with weaker eyesight, in full sunlight and on the move.
Developers get desktop and mobile views, states, motion and a component library. During the build we answer their questions, and when needed, we write the code ourselves.
04What we design
Each of these interfaces has a different job to do, so we design each one a little differently.
What we do
We design shops from the product page up: photos, variants, filters, comparisons, basket and checkout. We also cover what's specific to your business, for example products that can't be sold online.
What you get
Similar projects
What we do
We design portals where partners and resellers download materials, photos and presentations themselves. We start from the requests that reach you by email today and turn them into a menu.
What you get
What we do
We break the product down into steps customers understand without a catalogue in hand, and show the result after every choice. At the end there's a basket or an enquiry with the full configuration, so the sales rep doesn't start the conversation from scratch.
What you get
Similar projects
What we do
Architects come for something specific: a parameter, a drawing, a file for their project. We organise the website around the requirements they start from, and give them everything in a few clicks, in their own language.
What you get
What we do
Customer portals, tools for departments and apps for everyday work. We design what users do most often first, because that has to be the fastest. Less frequent features can wait one level down.
What you get
What we do
When a company runs several websites, in several countries or for several subsidiaries, we design one system: a shared framework, components and rules. Each website gets its own accent, and new ones come together faster, because nobody starts from scratch.
What you get
05Process
We work in stages, to a schedule you know before we start. After each stage we show what we've made and say what comes next, so you always know what we're doing, why and when. On smaller projects we combine some stages, but the order stays the same.
We get to know your customers inside out: who they are, what they want to get done and where they get lost today. We talk to you, to customer service and, whenever possible, to the users themselves.
What you get
We work out what's in the product, what belongs together and how to move between it all. This is where the most important decisions are made, so we don't take shortcuts.
What you get
A clickable wireframe of the key flows, with real content and no colours. We go through it with you screen by screen until everything is in its place.
What you get
We show the direction on one key view, often on a phone. Once that screen works, the rest has something to build on.
What you get
We design every view for desktop and mobile, together with the states that are easy to forget: an empty list, an error, a product that's unavailable. The recurring elements become a component library.
What you get
We hand over the files with a description of how elements behave, the motion and the graphics. During the build we answer developers' questions and check that the finished product looks like the design.
What you get
06Design system
In a presentation a button has one look. In the finished product it has to know what to do when someone hovers over it, reaches it with the keyboard or clicks it while the server isn't responding. We design each of these states once, in the component library, and every screen takes it from the same place.
01How it looks before anyone touches it.
02It lifts slightly, to show it can be clicked.
03A clear outline for people who navigate the page with a keyboard.
04It gives under the finger, so it's clear the click registered.
05It shows something is happening and ignores a second click.
06It confirms it worked, then returns to its default state after a moment.
07It says what went wrong and what to do next.
08It looks switched off and hints at what's missing.
07Questions
UX decides what's on the screen, in what order and what happens after a click. UI decides how it looks and behaves. The first starts with interviews and wireframes, the second ends with colours, typefaces and motion. There's more at the top of this page.
Yes. We then start by going through the wireframe with you, to understand the decisions already made. If something in a flow worries us, we'll say so before we start drawing.
Yes, and that's often where we start. We check what works and what gets in the way, and improve it in stages, so customers can keep using the product the whole time. We moved the Biurokoncept shop from its old platform together with its products, and every old product address now leads to the new one.
Figma. You get a file with views, components and styles that your team can keep working in. We export icons and graphics in formats ready for the build.
Yes. We build WordPress and WooCommerce websites and shops ourselves, like the Porta Architect Zone and the Biurokoncept shop. We can also hand the design over to your developers, as with the Overmax shop, and answer their questions during the build.
We check contrast, text size, keyboard order and screen reader descriptions in every project. When a website has to meet WCAG, we agree on the level at the start. That's how best.com.pl was made, built to WCAG 2.0.
Before we start, you know how the work will be organised, in which stages and what you'll get at the end. Then we stick to the schedule and show what we've made after each stage. If something needs your decision, we say so right away and suggest what we'd choose ourselves.
A Figma file with desktop and mobile views, a component library with states, a clickable prototype, a description of motion and element behaviour, and graphics for the build. If we build it ourselves, also a working website and training on the admin panel. Everything stays with you, so your team can take over part of the work, and we can come back together to extend it at any time.
Itodi
A new made-to-measure furniture brand built from scratch: the name, a logo with a stretched “o”, the design of a shop with a configurator, an instruction leaflet and packaging.
Overmax
UX/UI design for the Overmax shop: RC cars in cinematic shots, a carefully worked-out product page, a category menu and a quiz that picks a model for you.
Design Optyk
A family-run chain of premium eyewear stores: an identity without gold, in-store materials and a new online shop linked to the stock of six of its seven stores.
Acer
Over 1,200 jobs for five Acer markets, from banners for retail chains to a partner portal for Acer UK.
Porta PRO
UI/UX design and build of Porta's Architect Zone: doors filtered by specification, BIM files, a knowledge base that reads like a guide, and migrated content.
Biurokoncept
We designed and coded biurokoncept.pl: a catalogue of over a thousand pieces of furniture with a pCon configurator and an enquiry basket.
Nowa Stomatologia
A website for a dental clinic in Kraków that books appointments in two clicks, developed over four years.
Hana Design
A logo refresh, materials for architects, a website with a product configurator, and vehicle wraps.
Novicare
Identity for a manufacturer and distributor of orthopaedic equipment, the Novicare24 sub-brand, shop windows, materials and an online shop.
Porta Drzwi
A design system for an existing logo: a frame taken from the logo, grids, icons, drawings, a catalogue, porta.com.pl, social media and sales materials for a door manufacturer.
Mily Group
A rebrand for a deer antler supplier: communication strategy, logo, logo guidelines, the milygroup.com website and trade fair materials.
Dawtona Group
All of Dawtona's communication beyond the shelf: over 90 projects, from posts and trade fair stands to four websites and animations.
"*" indicates required fields
Cookies
With your consent, we use Google Analytics and Hotjar to see how people use the site, and Google Ads to measure how well our ads work. Without consent, the site works just the same. You can change your choice at any time under “Cookie settings” in the footer. Details are in our privacy policy.
The fluo_zgoda cookie remembers this choice for 12 months. Cloudflare Turnstile protects the forms from bots.
Plausible counts visits without cookies or personal data, so it works regardless of this choice.
