Brand priručnik

Vizuelni identitet isavia Intensivpflege

Ovo je radni dokument, ne izlog. Sve što je ovdje prikazano izvučeno je iz istog koda kojim je napravljen sajt, pa se ne može razići od stvarnog stanja.

Znak

Dvije figure u zagrljaju čije linije zajedno crtaju srce u negativnom prostoru. Veća figura je njegovatelj, manja pacijent. Znak nema fill atribut, boju nasljeđuje iz konteksta, pa radi na svakoj podlozi.

Na pozadini straniceosnovna upotreba

Na karticisekundarna

Na brand zelenojznak bijel

Na tamnojznak rosé

Zaštićeni prostor

Sa svake strane najmanje 0.5 × visina znaka praznine. Ništa ne ulazi u taj pojas, ni tekst ni ivica podloge.

Najmanja veličina

24 px40 px

Ispod 24 px visine srce u negativnom prostoru se izgubi i znak čita kao mrlja. Za favicon i sitne primjene koristiti samo znak, bez teksta.

Znak sa imenom

isaviaIntensivpflege GmbH

Ime je uvijek malim slovima. Dodatak Intensivpflege GmbH je verzal, prored 1.6 px, i ne prevodi se jer je dio registrovanog naziva.

Boje

Paleta Salbei i Rosé. Zelena nosi sistem i stoji na svemu što se klika, rosé je rezervisan za interakciju i toplinu. Klik na polje kopira hex.

Prozirne varijante

Slojevitost se pravi prozirnošću, ne novim bojama. Tako paleta ostaje mala.

Salbei 30 %#5F8C744Dgradijent linija, tanki obrubi

Salbei 20 %#5F8C7433pozadina meke oznake

Rosé 50 %#EDC7C180staklaste pilule preko fotografije

Muted 30 %#5C68624Drazdjelnici

Kontrast

Mjereno prema WCAG 2.1. Zato dugmad koriste #4F7A63, a ne svjetliju #5F8C74.

Ink na pozadini14.6:1AAA

Muted na pozadini5.4:1AA

Bijela na #4F7A635.1:1AA

Bijela na #5F8C743.9:1samo tekst ≥ 18 px

Ink na rosé10.2:1AAA

Tipografija

Inter, jedan font za sve. Naslovi su debljine 400, ne bold. Dojam težine dolazi od veličine i negativnog proreda, ne od debljine. Bold naslov razbija sistem.

Pravilo proreda

Negativni prored raste sa veličinom: −0.05em na 60 px, −0.044em na 44 px, −0.03em na 16 px, 0 na 14 px. Što veće slovo, to jače stisnuto.

H160 / 72 · 400 · −0.05em

Intenzivna njega koja dolazi kući

H244 / 52.8 · 400 · −0.044em

Intenzivna njega u svim oblicima

H332 / 41.6 · 500 · −0.031em

100+ zbrinutih

H424 / 31.2 · 500 · −0.041em

Njega na respiratoru

Lead18 / 30.6 · 500

Ovo je radni dokument, ne izlog.

Body16 / 24 · 400 · −0.03em

Lična njega jedan na jedan, uz diplomirane medicinske sestre, 24 sata dnevno, u poznatom domu vašeg člana porodice.

Small14 / 21 · 400

Besplatno, bez obaveze i povjerljivo.

Komponente

Sve niže je uvezeno iz istih fajlova koje koristi sajt. Ako se komponenta promijeni, ova stranica se mijenja sama.

Dugmad

Pređi mišem: krug iza strelice naraste preko cijelog dugmeta, tekst prelazi u tamni, strelica se okrene za 45°.

Dogovorite razgovor Sekundarno

Pilule i oznake

Eyebrow stoji iznad svakog naslova sekcije. Tagovi se poravnavaju po dnu kartice.

UslugeKarijeraVanbolnička intenzivna njega24 sataNjega 1:1Higijenski plan

Kartica usluge

Njega na respiratoru

Izrez gore desno nije clip-path nego PNG alpha maska. Pređi mišem za rosé.

24 sataNjega 1:1

Kartica brojke

100+

Tačka se boji progresivno, isto kao koraci na timeline.

Kartica sa ikonom

Stalni tim

Ikona je maska, boju uzima iz pozadine, pa ista datoteka radi u svakoj boji.

Staklene pilule

Njega jedan na jedanRespirator i trahealna kanila

Idu isključivo preko fotografije. Pozadina bijela 25 % uz backdrop-blur.

Akordeon

Visina se animira preko grid-template-rows, plus se okreće u minus. Više redova može biti otvoreno istovremeno. Širina je 842 px, uži kontejner za čitanje.

Zatvoren red je visok 74 px, radijus 28 px.

Ikonografija

Pune ilustrativne ikone, ne linijske. Jedina linijska je strelica u dugmadi. Ikone se ne ubacuju kao slike nego kao CSS maske, pa boju uzimaju iz pozadine elementa.

i01Tijelo, bol

i02Srce, monitor

i03Osoba, plus

i04Flasteri

i05Pokret

i06Ruke, briga

Kako se koristi

<Ikona broj="02" className="h-6 w-6" boja="bg-primary-deep" />

/* ispod haube: boja dolazi iz backgrounda, ne iz fajla */
.ikona {
  background: currentColor;
  mask: url(/ikone/i02.svg) center / contain no-repeat;
}

Pokret

Jedna kriva za sve. Pojavljivanje traje 0.6 s, promjena stanja 0.4 s. Elementi ulaze pomakom od 24 px, kartice od 125 px uz umanjenje. Kašnjenje se slaže u koracima od 0.1 s.

Kriva

cubic-bezier(0.44, 0, 0.56, 1)

Simetrična, blago ubrzava pa usporava. Jedina tvrdo izmjerena kriva na izvornom sistemu.

Trajanja

0.6 spojavljivanje pri skrolu

0.4 sboja i prozirnost pri prelasku mišem

0.4 sspring, bounce 0.2, timeline krugovi

0.1 skorak kašnjenja između susjednih elemenata

Uživo

Tri preseta, ista kriva, različit pomak.

R1opacity 0 → 1, y 24 → 0

R2opacity 0 → 1, y 125 → 0, scale 0.8 → 1

R3footer, y 24 → 0, scale 0.8 → 1

Pristupačnost

Sve poštuje prefers-reduced-motion. Uvodna animacija se preskače, video se ne učitava, scroll efekat na kontaktu se gasi. Vidljivi focus prsten je obavezan zbog BFSG i EU EAA na njemačkom tržištu. Izvorni sistem ga nema, mi ga dodajemo.

Fotografija

Fotografija nosi povjerenje jače od svakog teksta na sajtu. Zato ima najstroža pravila.

Tako da

Stvarno osoblje i stvarni prostori, uz pisanu saglasnost
Prirodno svjetlo, topli tonovi, kućno okruženje
Radnja u toku, ne poziranje u kameru
Radijus 20 px, cover krop, bez filtera i preliva
Dostojanstvo pacijenta ispred svakog kadra

Nikako

Generički stok: rukovanje, stetoskop, bolnički hodnik
Prepoznatljiv pacijent bez potpisane saglasnosti
Rane, stome, kanile, medicinski detalji izbliza
Prije i poslije prikazi
Duotone, jaki filteri, crno bijelo

Fotografija pacijenta je zdravstveni podatak i spada u posebnu kategoriju po članu 9 DSGVO. Bez potpisa ne ide online, ni na sajt ni na društvene mreže.

Ton

Porodica koja ovo čita najčešće stoji u bolničkom hodniku i odlučuje pod pritiskom. Pišemo za taj trenutak.

Mirno, ne veselo

Bez uzvičnika, bez emodžija, bez marketinškog poleta. Ovo nije proizvod koji se slavi.

Konkretno, ne pridjevski

„Diplomirana sestra je prisutna neprekidno“ umjesto „srdačna i posvećena njega“. Svaka tvrdnja mora biti provjerljiva.

Vodimo, ne prodajemo

Objasni šta se dešava dalje i ko šta radi. Porodica ne kupuje njegu nego siguran prelaz iz bolnice kući.

Rječnik

klijent→pacijent, ili vaš član porodice

usluga→njega, zbrinjavanje

paket→ne koristi se, njegu plaća osiguranje

osoblje→diplomirane medicinske sestre

ponuda→savjetovanje, razgovor

Šta se ne smije

Njemački Heilmittelwerbegesetz zabranjuje dobar dio uobičajenog marketinškog rječnika u zdravstvu. Ovo nisu preporuke nego pravni okvir.

Zakonski zabranjeno

Garancije ishoda, „zagarantovano odvikavanje od respiratora"
Reklamiranje strahom, § 11 st. 1 t. 7 HWG
Dramatizirane izjave pacijenata, § 11 st. 1 t. 11 HWG
Provizije za upućivanje, dira i § 299a Krivičnog zakona
„Najbolji u regiji" bez dokaza, § 5 UWG

Dizajnerski

Sjena na kartici, dubina se pravi tonom podloge
Bold naslov, težina dolazi od veličine i proreda
Rosé kao glavna boja, on je samo naglasak
Iskačući prozori, chat botovi, odbrojavanje
Grain preko kartica, ide samo na pozadinu