Design nyelvi rendszerek: Miért van szüksége a csapatodnak és hogyan kell felépíteni?

Tervezési nyelv rendszer

A fejlesztés során a termék-, a tervezési és a mérnöki csapatok különféle projektmenedzsment módszereket alkalmaznak. A projektek és a csoportok növekedésével a menedzsment egyre nehezebbé válik. Vizsgáljuk meg, hogy a tervezési nyelvi rendszerek hogyan könnyítik meg az életet ilyen helyzetekben.

Jelenleg számos jelentős piaci részesedéssel rendelkező vállalat kizárólag szoftvergyártással növekszik. Mások számára a szoftver bevételük nélkülözhetetlen része. Ezenkívül a nagy cégek (Atlassian, Dropbox, LinkedIn stb.) Átlagosan 65% -kal növelték tervezői csapataikat az elmúlt 12 hónapban. (Design in Tech Report 2017)

Hat nagy technológiai vállalat megduplázta tervezési bérleti céljait az elmúlt fél évtizedben. (TechCrunch)
A következetesség a felhasználói élmény egyik alapvető témája. A nagy projekt következetességének fenntartása önmagában gyakran probléma.

Amíg a projekt hatóköre növekedni kezd, a termelékenység és a sebesség bizonyos problémákkal szembesülhet, amelyek hátrányosan befolyásolják azt. Néhány ezek közül:

  • Rossz a kommunikáció a termék, a tervező és a mérnöki csapat között.
  • Különbségek a tervezési outputok között.
  • Koherencia és szerkezet hiánya a kódban, ami a termék teljesítményével kapcsolatos problémákat idéz elő.

Általában a mérnöki csapatok speciális módszerekkel rendelkeznek a termelékenység és a szabványok mérésére. Például: Agilis, kód áttekintés, kód lefedettség, egység / integrációs teszt stb.

A tervezés másképpen működik. A menedzsment módszerek elvontabbak, és a fejlesztési folyamat nincs sok ellenőrzés vagy korlátozás alatt. A minta könyvtár vagy a stílus útmutató bizonyos szabványok meghatározására szolgál.

Így minden új tervező és a projekt minden új része növeli a folyamat káoszt és lelassítja a sebességet.

Ennek ellenére a mérnöki csapatok a tervezés irányába kódolják a tervező csapattól. Ez megismétlődik, és animációként, komponensként és a különféle funkciókkal való interakcióként jelenik meg a felhasználó számára.

A felhasználói oldalon:

  • Rossz felhasználói élmény
    A termék következetlensége befolyásolja a bizalom és a termék ismereteit.
  • Teljesítmény
    Mint már említettük, az ismétlődő kóddarabok, amelyek szerkezeti és teljesítményproblémákat okoznak.

Tervezési nyelvi rendszer

A tervezési nyelv az újrafelhasználható funkcionális elemek gyűjteménye (gomb, forma, fejléc stb.). A leíróbb részek az ikon, a szín, a tipográfia, az animáció stb. Az interfész ezen elemeit bizonyos szabványok határozzák meg. Ez a termék kifejezésének egyik formájaként is leírható.

A dizájn harmonizációt teremt minden platformon, ha jó dizájnnyelv-rendszert használnak. A szigorú tervezési szabványok fenntartása elősegítheti a felhasználók bizalmának és ismereteinek növelését.

alapjai

Feltételezhetjük, hogy a tervezési nyelv valódi nyelv. Nem tud hirtelen építeni; lépésről lépésre fejlődik a márkával az idő múlásával.

A fejlesztési folyamat során következetlen részeket kell látni. Ezután dolgozzon ki visszamenőleges szabályozásokat vagy újonnan alkalmazott elemeket. Ezeknek összhangban kell lenniük a jelenlegi struktúrával. Néhány alapelvet és gyakorlati módszert követve a csapatok biztosak lehetnek abban, hogy a rendszer folyamatosan fejlődik.

Terminológia

A csapatok különféle fogalmakat használnak az általuk preferált tervezési szabványok kidolgozására.

  • Funkcionális minta, alkatrész: Újrahasznosítható kézzelfogható elemek. Gombok, űrlapmezők, navigáció stb.
  • Percepcionális minta, stílusok: Ez elvont, mint a funkcionális minta. Érzelmileg javítja az üzenet észlelését. Szín, tipográfia, animáció stb.
  • Minta könyvtár: A funkcionális és az észlelési minták dokumentálása.
  • Stílus útmutató: A minta könyvtár használatára vonatkozó szabványok dokumentálása. Ez magában foglalja a logó használatát és a hely beállítását. Ezenkívül példákat tartalmaz a bevált gyakorlatokra és információkat a fejlesztési folyamatról.

Közös nyelv

A tervezési nyelvet az összes érintett csapatnak meg kell értenie, hogy a projekt következetes módon holisztikusan haladhasson. Ennek másik módja az, ha azon gondolkodunk, akik ugyanazt a nyelvet beszélik. Sokkal könnyebb kommunikálni, amire szükség van, egy olyan emberrel, aki ugyanazt a nyelvet használja, mint az, aki nem.

A tervezési nyelv megválaszolja a következő kérdéseket. A projekt során a tervező és a mérnökök gyakran kérdezik ezeket:

  • Milyen kék árnyalatot használunk?
  • Meg tudod csinálni ezt nekem?
  • Hol van a logónk?
  • Ezt a mintát valahol máshol használták?
  • Felépítheti ezt, ez nem felel meg a tervnek?
  • Mi a legfrissebb dokumentáció?
  • Hogyan építjük fel ezt a mintát?
  • Hol vannak a komponensek?

A sikeres tervezési nyelvi rendszer sikere érdekében holisztikus stílusú útmutatót kell használni. Ez az útmutató termék-, tervezési és mérnöki alkotóelemeket tartalmaz, és irányelveket kell alkalmazni. Ehhez a következő kritériumokat kell betartani:

  • Hatékonyság
    Az alkatrészek, a színek és az elemek meghatározásainak könnyen érthetőnek kell lenniük. Ez megtehető úgy, hogy vizuális hangosságra vagy metaforákra nevezünk.
  • Legjobb gyakorlatok
    Az eszközök használatának bevált gyakorlatait kódmintákkal kell meghatározni.
  • Márka érzés
     Az az érzés, hogy a márka a felhasználói oldalon akar tükröződni. Ez lehet élénk és energikus, játékos és barátságos, határozott és biztos, kiegyensúlyozott és stabil, nyugodt és puha, stb. Ezt animációkkal és színes felhasználásokkal kell megtenni, amelyek egy kicsit megkönnyítik a dolgokat.
  • Szín és ikonográfia és tipográfia
    Fontos a szín, a tipográfia és az ikonok használata az üzenet vizuális támogatására. A márkaérzékhez megfelelő ikonok tervezése megerősíti az üzenet jelentését.
  • Minta könyvtár
    A minta könyvtár a felhasználói felület tervezési elemeinek gyűjteménye.
  • Élénkség
    Az egyik alapvető téma a márka érzésének a felhasználó számára történő megjelenítésében.
  • Hozzáférhetőség az érdekelt felek számára
    A stílus útmutatónak mindenki számára hozzáférhetőnek kell lennie. Ha lehetséges, az irodai környezetben mindenki számára jól látható helyen jeleníthető meg. Ez segíthet nekik a hiányzó alkatrészek meglátásában, és megerősíti a csapattagok ismereteit.
  • Hozzáférhetőség a felhasználó számára
    Amint a szín és az alkotóelemek meghatározása megtörtént, a 11y szabványoknak megfelelően hozzák létre azokat, amelyek szélesebb közönség elérését teszik lehetővé.
  • Útmutató
    Pontosan meg kell határozni, hogy a csapat hogyan járul hozzá a folyamatokhoz.

Hogyan kezdjük?

Eddig minden jól hangzik, de ha nem tervezi meg a folyamatait, akkor rövid idő alatt el kell végeznie egy bonyolult feladat megoldását.

A tervezési nyelvi rendszer létrehozása során előnyös a csapatok kultúrájának megfelelő viselkedés. Meg kell határoznia azokat a kritériumokat, amelyeket mindenki kész és hajlandó követni.

Szabályok (szigorú - laza)

Szigorú szabályok: Vannak pontos szabályok és folyamatok, amelyeket szigorúan betartanak.

Laza szabályok: A márkaérzet és az oldal hasznossága elsőbbséget élvez a tökéletes vizuális következetesség felett.

Például az Airbnb-től:

  • Szabványosított előírások.
  • A tervezés teljesen szinkronban van a mérnöki csapattal.
  • Szigorú folyamat az új minták bevezetéséhez.
  • Átfogó, részletes dokumentáció.

A TED-től:

  • Egyszerű vázlat a részletekért.
  • Egyszerű dokumentáció.
  • A hátrányok kezelése és az irány kiválasztása.

Szervezet (központosított - elosztott)

Centralizált modell: A szabályokat és mintákat elsősorban egy embercsoport kezeli.

Elosztott modell: Ahol mindenki, aki a rendszert használja, felelõs annak fenntartásáért és fejlesztéséért.

Alkatrészek (moduláris - integrált)

A moduláris felépítés lehetőséget kínál a teljes mérnöki csapattal való együttműködésre. Így gyorsan előállíthat termékeket, amelyek alkalmasak minden platformon. Ha fogalmi mintákat üzenet értelmében készít, akkor az integrációs módszer hasznosabb lesz.

A stílusok jönnek és mennek. A jó dizájn nyelv, nem stílus - Massimo Vignelli

Következtetés

A tervezési nyelvi rendszer a csapatok közötti márkakommunikáció szabványát biztosítja. Azt is lehetővé teszi, hogy meghatározza és elérhetővé tegye azokat az érzéseket vagy üzeneteket, amelyeket a felhasználónak meg szeretne adni.

Köszönet Turgay Mutlay-nak az illusztrációkért;)

-

Követhetsz engem a Medium, LinkedIn, Twitter, Dribbble, GitHub webhelyen!

Erőforrások

Tervezési nyelv - Wikipedia
Hogyan lehet pénzt szerezni a boldogsággal - Harvard Business School
A vizuális hangosság használata a jobb útkereséshez - Tom Osborne
Animáció a tervező rendszerekben - Sarah Drasner
Az animáció integrálása a tervezőrendszerbe - Alla Kholmatova
Vizuális nyelv felépítése - Airbnb
Kontraszt-ellenőrző - Webaim.org
w3.org - Webes akadálymentesség kezdeményezés
Kisegítő lehetőségek fejlesztői eszközei - a Google Chrome kiterjesztése