Origins

Where Empatyzer came from.

Piotr Golczyk, założyciel Empatyzera, jest menedżerem i marketerem z blisko dwudziestoletnim doświadczeniem w zarządzaniu ludźmi. Pracował w małych i średnich firmach, a potem w międzynarodowej firmie technologicznej, gdzie prowadził globalny, rozproszony zespół marketingowy. Spotykali się w nim ludzie od backendu i analityki po kreację i copywriting, a różnorodność zespołu szybko nauczyła go jednego: ta sama sytuacja bywa odbierana zupełnie inaczej przez różne osoby.

Przez lata szukał odpowiedzi w coachingu, mentoringu, rocznym programie rozwoju umiejętności miękkich, a także w narzędziach takich jak DISC, MBTI, Big Five czy Reiss Motivation Profile. Każde z nich dawało wartościową wiedzę o sobie i innych, ale ta wiedza szybko blednie: po szkoleniu łatwo o niej zapomnieć, a złożoną diagnozę łatwiej zapamiętać jako etykietę niż jako narzędzie do działania.

Prawdziwa luka jest gdzie indziej, między wiedzą a działaniem. Wiedzieć, czym różnią się ludzie, to jedno. Wiedzieć, jak w danej rozmowie przekazać komuś swoją intencję tak, by nie została źle odczytana, to zupełnie inna sprawa, zwłaszcza że nawet duże doświadczenie nie chroni przed odruchem, by traktować innych tak, jak sami chcielibyśmy być traktowani.

Z tej luki powstał Empatyzer.

Em łączy wiedzę o użytkowniku, drugiej osobie i sytuacji, a przed rozmową podpowiada, jak dobrać sposób komunikacji i na co uważać, żeby intencja została jasno przekazana i nie została źle odczytana. Dzięki temu wiedza o ludziach zaczyna pracować dokładnie wtedy, kiedy jest potrzebna, a każda rozmowa może stać się lekcją lepszego zarządzania.

Empatyzer. Before an important conversation.

Brand idea

Important conversations at work should not be left to intuition.

Em helps adapt the conversation to a specific person, so your intention is clear and less likely to be misunderstood.

Brand language

Each of Empatyzer’s key messages has a different role.

Positioning

Empatyzer is a system for preparing for important conversations at work. It combines knowledge about the people involved and the situation to suggest how to communicate your intention clearly and reduce the risk of misunderstanding.

Defines what Empatyzer is and the position the brand occupies.

Brand belief

Important conversations at work should not be left to intuition.

Defines the problem Empatyzer addresses.

Product promise

Before an important conversation, Em helps you adapt your communication to the specific person.

Em suggests what to say, what to avoid and what to pay attention to, so your intention is clear and less likely to be misinterpreted.

Shows the practical value of the product.

Brand claim

Before an important conversation.

Empatyzer. Before an important conversation.

Empatyzer’s consistent brand signature.

Activation line

Don’t guess. Ask Em.

Before an important conversation. Ask Em.

Leads the user to take action and ask Em.

Brand metaphor

To be on the same wavelength.

People can be different and still understand each other well. Empatyzer helps adapt the conversation to the person on the other side.

It is the source of Empatyzer’s wave and visual language.

Positioning defines the brand’s place. The brand belief names the problem. The product promise explains the value. The claim signs the brand. “Ask Em” leads to action. “On the same wavelength” connects the visual language.

01 Anatomy of the wordmark

One mark, five layers.

Hover or tap a fragment of the wordmark. The wordmark stays one whole, and the braces show what works inside it.

. M em empat- -yzer

02 M

M is a letter. And a wave.

M comes from the name Em and also works as a standalone symbol. Its shape flows into a wave, which becomes the basis for the wider visual language of the brand.

LetterLetter from EmStandalone symbolWave

03 The wave

To be on the same wavelength.

We say that people are on the same wavelength when they understand each other easily. This expression is the origin of Empatyzer’s wave. People can have different temperaments, needs, cultures and ways of communicating. Empatyzer helps take those differences into account when preparing for a conversation.

People remain different. The conversation changes.

The people on both sides remain the same, with their own rhythms. M represents Em, helping take their differences into account before the conversation. This makes it easier to express an intention in a way the other person has a better chance of understanding as intended.

04 People

Different people stay different.

The characters show real differences between people: temperament, age, working style and perspective. Empatyzer is a system with room for many different people.

05 Photography

The same world. Real faces.

Photography tells the story of people who have to get along: different moods, situations and points of view.

Woman with her hands to her face, thinking — **Maja** · Reflection

Smiling man in a green polo shirt — **Karim** · Openness

Man in glasses and a checked shirt — **Jonas** · Focus

Smiling man in a jacket at a laptop — **Tomasz** · Confidence

Woman in glasses holding a mug by the window — **Helena** · Calm

Tense man on the phone at a laptop — **Marek** · Tension

Woman in a hijab working on a tablet — **Amira** · Doubt

Smiling young man in a wheelchair, in a yellow shirt — **Olek** · Ease

06 Tape

Separate perspectives. One team.

Separate photos can be taped symbolically into one team. The pieces stay different, held together by a shared brand language: Em, M and the wave. The tape is a supporting element of the identity and works alongside the wordmark.

07 Pattern and background

One wave. Many applications.

Repeating M creates a pattern. At a larger scale, the same wave builds a background. Both applications grow from the same motif and remain supporting elements of the visual system.

Background made from the large Empatyzer wave

08 Colour

Purple is the base. The rest opens the system to other contexts.

Light lavenders and paper give room to breathe. Teal is a strong second direction, yellow a production accent, pink the colour of tension.

Purple#4F2854

Lavender#8D84A0

Mist#ABA3BB

Paper#FEF8FF

Indigo#4E458B

Blue#84C0D5

Teal#239886

Yellow#FFCC00

Pink#FF3066

Services, businessPurple – the brand’s base environment.

Hospital, medicalGreen / teal – a calm, clean second direction.

ProductionYellow – an energetic accent on purple.

09 In the product

The same story, in the product.

M becomes Em’s avatar, and the “.em” mark a small marker in the interface. The wave returns as a metaphor for understanding and fit. The whole story carries straight into the product.

Go to the identity system

Em · coach

In an hour I’m talking to Marek about the project budget. How should I approach him?

Marek values specifics and numbers. Start with the conclusion, then show the reasoning. Leave him a moment for questions; he likes time to think.

And if he says the budget is too big?

Ask which part he doubts, and talk about exactly that. For him, that’s a sign you’re listening.

Ask Em

Identity system

One brand world, in order.

The family of marks, colour versions, palette, patterns, backgrounds and usage rules. Files are vector (SVG), descriptively named and ready to download.

Wordmark

The primary version is the “.empatyzer” wordmark in purple on paper. The reverse (light) version works on purple and other dark fields. The wordmark is one whole, and its short forms are the “.em” mark and the M symbol, described below.

Primary – purple on paperDownload SVG

Reverse – light on purpleDownload SVG

Clear space and minimum size

The clear space around the wordmark equals the height of the letter M (marked on the diagram). It stays free of text, other marks and the edge of the format. Minimum wordmark width: 120 px on screen, 25 mm in print. Below that, use the “.em” mark or the M symbol.

wordmark-clear-space.svgDownload SVG

Wordmark – min. 120 px / 25 mm

.em mark – min. 48 px / 10 mm

M symbol – min. 24 px / 6 mm

Responsive wordmark: three steps

The mark adapts to the available width. From 120 px the full wordmark is used, from 48 to 119 px the “.em” mark, below 48 px the M symbol. The thresholds follow the minimum sizes: the mark steps down instead of shrinking below its minimum.

Available width 200 px full wordmark

full wordmarkfrom 120 px

.em mark48–119 px

M symbol24–47 px

The rule in CSS (container queries): three forms in one container, only one visible at a time.

.logo { container-type: inline-size; }
.logo__wordmark, .logo__em, .logo__m { display: none; }
@container (min-width: 120px) { .logo__wordmark { display: block; } }
@container (min-width: 48px) and (max-width: 119.98px) { .logo__em { display: block; } }
@container (max-width: 47.98px) { .logo__m { display: block; } }

The .em mark

The short form of the mark: the dot and the name Em. Used where the full wordmark is too long: icons, avatars, small interface markers, the tape and patterns.

.em mark – purpleDownload SVG

.em mark – lightDownload SVG

The M symbol

The shortest form of the brand, always in the original geometry of the letter from the wordmark. M works as Em’s avatar, favicon, pattern element and the centre of the wave.

M symbol – purpleDownload SVG

M symbol – lightDownload SVG

Versions on colour fields

On dark and saturated fields the mark is light (paper). On light fields it is purple. The mark has only these two versions, and the field changes around it.

Light mark

purple · #4F2854Download SVG

dark purple · #3A1F3EDownload SVG

teal · #239886Download SVG

indigo · #4E458BDownload SVG

mist · #ABA3BBDownload SVG

purple · #4F2854Download SVG

dark purple · #3A1F3EDownload SVG

teal · #239886Download SVG

indigo · #4E458BDownload SVG

Purple mark

paper · #FEF8FFDownload SVG

blue · #84C0D5Download SVG

yellow · #FFCC00Download SVG

paper · #FEF8FFDownload SVG

blue · #84C0D5Download SVG

yellow · #FFCC00Download SVG

Colour

Nine colours, one base. Purple builds the brand environment; lavender, mist and paper give room to breathe; teal, blue and indigo are supporting fields; yellow and pink are accents with a defined meaning.

Purple Brand base, backgrounds, text on light

Lavender Supporting fields, large secondary text

Mist Light fields, patterns, secondary text on dark

Paper Text on dark, light backgrounds, reverse mark

Indigo Supporting field, charts

Blue Supporting field, patterns, illustration

Teal Second direction: medical, tape, accents

Yellow Production accent, highlights

Pink Tension, conflict, interference – accent only

Industry accents

The same mark, a different field. Purple for services and business, teal for hospitals and medical, yellow for production.

Text contrast

WCAG values for the most common combinations. Body text needs 4.5:1, large text and graphic elements 3:1.

Combination	Contrast	Use
AaPaper on purple	11.39:1	Text of any size
AaPaper on dark purple	13.90:1	Text of any size
AaMist on dark purple	6.01:1	Secondary text
AaPurple on paper	11.39:1	Text of any size
AaPurple on yellow	7.87:1	Text of any size
AaPurple on mist	4.93:1	Body text (AA threshold)
AaPaper on teal	3.40:1	Large text and the mark only
AaPaper on mist	2.31:1	The mark only

Patterns and backgrounds

The pattern is the M wave repeated in rows, and the background is the same wave stretched across the full format. Both are shown in use: they fill the frame, and the wordmark stands beside them in a calm zone.