A VKontakte új dizájnja. A VKontakte új kialakítása - a csoport vízszintes borítója A VKontakte újratervezése

A cikk témája az új dizájn VKontakte. Ismét megváltozott, most már beállíthat egy csoportban vízszintes fedelet. A VK-közösség tervezése egy ilyen fejléccel sokkal érdekesebb. Őszintén szólva, itt nincs szükség Photoshop-ismeretre. Meg tudod csinálni különösebb képességek nélkül? gyönyörű kép akár PowerPointban, Fotorban, Canvában, Pixlr Editorban.

A csoportba lépve észreveszi, hogy ezekben a csoportokban a „Rögzített bejegyzés”, az „Információ” és a „Kattintson menü” gombok láthatóvá váltak. És mielőtt elrejtették őket. Természetesen azonnal megkezdődött a csoportok regisztrációja.

Új borító feltöltése

Most nézzük meg, hogyan lehet engedélyezni a vízszintes fejléc telepítésének lehetőségét. Kattintson a "Kezelés" gombra.

Ezután kattintson az utolsóra, és töltse le a VKontakte csoport új borítóját. Itt értheti meg, hogy a letölthető fájl bármilyen méretű lehet! De nem kisebb, mint a mérete 1590x400 px. Bármely szerkesztőben elkészítjük a borító prototípusát. Ezután kiválaszthatjuk és menthetjük azt a területet, amely megfelel a VK követelményeinek. Íme egy tipp, hogy hol találhat borítóképet, és melyik szerkesztőt használja

Mi érdekes a VKontakte új dizájnjában?

A lényeg: több hely van az információnak. Most ide írhatja a csoport nevét, létrehozásának célját, cselekvésre való felhívást stb. Ez a kialakítás logikusan teljes és funkcionálisabb lesz. De hagyhatod régi design, ez mindenkinek az ízlése.

Amikor vízszintes borítót tervez, észre fogja venni, hogy a belső menü most valahogy kiesik az általános kontextusból. Szerintem jobb lenne rögzíteni a képet a menühöz. És használja wikioldalak tárolására a csoportban.

Ugyanakkor szeretném, ha a fejlesztők hozzáadnának egy másik lehetőséget a Wiki-oldalakra való gyönyörű átmenet létrehozására.

Szeretném megjegyezni, hogy 2016 óta a fejlesztők közösségi hálózat A VKontakte aktívan próbálja létrehozni ezt a hálózatot az üzleti élet előmozdítása érdekében. Tedd kényelmesebbé az üzlethez vagy ilyesmi. Az én szempontomból ez nagyon jó, és sok internetes vállalkozó körében nagy a kereslet.

De ami a legfontosabb, véleményem szerint alaposan át kell gondolniuk a „Bans” rendszert, hogy a vállalkozók nyugodtan dolgozhassanak anélkül, hogy zavarnák azokat a felhasználókat, akik szórakozni jöttek a közösségi hálón.

Hogyan készítsünk online VKontakte csoportborítót

Használja kreativitását, és válassza ki, amit szeretne: vízszintes fedelet vagy a már megszokott VKontakte dizájnt. Az online készítés és az új burkolat felszerelése lépésről lépésre világosan bemutatásra kerül a cikk alatti videóban.

P.S. Remélem, ez az információ hasznos az Ön számára.

P.S.S. Használd kreativitásodat és sok szerencsét minden próbálkozásodban!

Ma a Dribbble Meetup konferencián Pavel Shumakov, a VKontakte vezető tervezője bemutatta a VKontakte weboldalának új dizájnját, a cég iOS és Android mobil klienseit, valamint egy teljesen új fotóalkalmazást.

A VKontakte előnyben részesítette az új webhely dizájnjával kapcsolatos intrikák meghosszabbítását, és a bemutatókon a képernyőképet is elmosta. De ez a példa elég ahhoz, hogy általános benyomást alkosson az újratervezésről. A webhely úgynevezett „szigetekre” van osztva - minden bejegyzés vagy bármely más blokk vizuálisan elkülönül egymástól. A webhely szélessége és betűtípusa megnő.

Határidő: 2015 végéig.

Fotó alkalmazás VKontakte


Személy szerint jobban érdekelt minket a VKontakte egy teljesen új terméke - fényképes alkalmazás. Ez az Instagram egyfajta analógja. Még a 2014-es LIVE Eventünkön jelentették be, de mi, hozzád hasonlóan, csak ma láttuk először, és lenyűgözött. Az új alkalmazást professzionális fotósokkal közösen fejlesztik. Ebben az olyan nyilvánvaló funkciókon kívül, mint a színkorrekció, saját szűrőket hozhat létre, és megoszthatja azokat barátaival. Az alkalmazás teljes mértékben szinkronizálva van a VKontakte-val.


Idővonal: reméljük, hogy idén nyáron kiadjuk az alkalmazást, mert ebben az időben relevánsabb lesz, mint valaha.

A régóta várt Material Design az Android VKontakte kliensében. A teljes alkalmazás teljes újratervezése. Még a Yabloko kollégáink is ránézve féltékenykedni kezdtek. Lehetőség van logóval ellátott táskák gyártásának megrendelésére is. Most ez a folyamat kényelmes és gyors lesz.

Határidő: hamarosan.

Videókatalógus és új felvételek iPhone-ra


De az iPhone tulajdonosoknak is van miért örülniük. Nagyon régen megkapták az újratervezésüket, ami még mindig aktuális, így a bemutatón új felvételeket és természetesen a bemutatott videókatalógust is bemutatták nekünk. Nyilvánvaló, hogy nem csak ezek a változások.

Gyors újratervezés mobil alkalmazásokés iOS. Első frissítési koncepciók megjelenés ben jelent meg hivatalos blog„VKontakte”, amelyben Knyazev többek között a cég tervezőinek munkájáról is beszélt.
A Tabbar ismét megjelenik a klienseken és az iOS-en – egyetlen navigációs sáv a képernyő alján lévő fülekkel, amelyek lefedik a fő funkciókat. A közösségi hálózat tervezői egyébként 2012-ben elhagyták. Az új tervezési vízióban a lap a VKontakte fő részeit tartalmazza: „Hírek”, „Keresés és ajánlások”, „Üzenetek”, „Értesítések” és a felhasználói menü. Oldalsó menü, a közzétett képernyőképekből ítélve az újratervezés során teljesen eltávolítják az alkalmazásokat.




Amellett, hogy a gyökeresen új felhasználói felület, a VKontakte tervezői számos funkcionális újítást adnak hozzá a megjelenés közelgő frissítésével. A „Keresés és ajánlások” részben a közeli felhasználók téglalap alakú történetei, valamint új szerzők potenciálisan érdekes bejegyzései jelennek meg. A VKontakte vezető tervezője leírja új szakasz mint „olyan ragadós dolog, ahol jó minőségű és ismeretlen dolgokat találhat, figyelembe véve a személyes preferenciákat”. Megtekintésszámláló kerül a hírfolyamba (jelenleg csak bejegyzés megnyitásakor jelenik meg), a kedvelések pirosra váltanak.

Mikor jönnek ki a frissítettek?

A Runet gyenge a jól ismert webhelyek és szolgáltatások újratervezésének áttekintésében. Ez a cikk nem ennek javításáról szól. Célom, hogy megbeszéljem a közösséggel a VKontakte webes verziójának egyik problémájának megoldását.

A VK újratervezésére kiírt tavalyi pályázaton a pályázat kiírói a webes verzió problémáit említették. Első számú problémaként az oldal szűk szélességét nevezték meg. Egyetértek a VKontakte csapatával, és úgy döntöttem, hogy saját megoldást készítek a probléma leküzdésére.

Fájdalom

1. probléma – Keskeny képernyő


A képernyő szélességén kívül további 2 problémát azonosítottam.

2. probléma – A webes verzió és az alkalmazások eltérő stílusa



3. probléma - Messenger

A Messenger viszonylag nemrég jelent meg a VK-n. Az első verzió észrevehetően kiment a divatból, és idővel ez megoldódott. A messenger fő problémája szerintem az, hogy párhuzamosan él az oldallal. A levelezési ablak kicsi. És bár méretezhető, abszolút koordinátákhoz van kötve - nem kényelmes a szolgáltatás használata. A Facebookon a messenger is külön él az oldaltól, sok kis levelezési ablakot létrehozva.



Elmélet – a szélesebbé válás módjai

Először döntsük el, mi az a keskeny képernyő. A VC jelenlegi szélessége 791 db. A versenyfeladat szerint az oldalt 1024pk felbontásra kell igazítani. Ahogy én látom, a keskeny képernyő problémájára egy 1024-1600db felbontáson működő interfész lesz a megoldás. Azaz az interfész szűk (1024pk) és széles (1440+pk) felbontáson is képes működni.

1. Fizikai nyújtás

A megoldás egyszerű – gumiból készítjük a helyszínt.

Előnyök:
+ Könnyen megvalósítható

Hátrányok:
− A tartalom olvashatatlanná válik
− Teljesen felül kell vizsgálni az oldal egyes szakaszait (például barátok)

2. Párhuzamos bemutatás

A technikát az iA 2006-os Facebook-újratervezési koncepciójában láthattuk – a hozzászólások a bejegyzések jobb oldalán találhatók. 5 éve kipróbáltam az egyik projektemen.

Előnyök:
+ A bejegyzések lineárisan vannak elrendezve, anélkül, hogy megjegyzések zavarnák őket
+ A bejegyzésekhez fűzött megjegyzések azonnal láthatóak további átmenetek nélkül

Hátrányok:
− Egyenetlen információsűrűség a képernyőn
− Az 1024db-os változat nagy nehézségek árán elkészíthető, vagy el kell térnie a széles verziótól
− Az oldal egyes részeinek teljes felülvizsgálata szükséges

3. Tolópanelek

A webszolgáltatásokban népszerűvé vált megközelítés: CRM rendszerek, feladatkezelők. A képernyő függő panelekből áll. A panelek egymástól jobbra jelennek meg, ha a képernyő nem tartalmaz mindent, akkor a bal oldali panelek el vannak rejtve, ahogy a jobb oldaliak megjelennek.

Előnyök:
+ Kis felbontásnál panelt válthatunk, nagy felbontásnál mindent egyszerre
+ A felület hasonlósága a táblagépekhez készült verzióhoz

Hátrányok:
− A webfelhasználók számára nem ismert lehetőség
− A webhely nem a képernyő közepén, hanem a bal oldalon található
− Nagy volumenű építészeti munka
− Nincs lineáris megtekintés; a kommentek elolvasásához a hírre kell kattintani

4. Két ablak

Interfész két aktív munkarésszel a képernyőn.

Előnyök:
+ Kevés módosítást igényel az aktuális felületen

Hátrányok:
− Nem világos, hogyan kell egyszerre 2 üzemmóddal dolgozni, és miért

5. Két oszlop

Az információ megjelenítési mód hasonló a Facebook idővonalához. Az ezen az opción alapuló koncepció az won a VK újratervezési versenyén.

Előnyök:
+ Könnyen rendszerezhető információk
+ Egységes adatsűrűség a képernyőn

Hátrányok:
− Megosztott a figyelem hírek olvasásakor
− Facebook

6. Kártyák

Váltás a függőleges történetmesélésről a rácsra. Példa - Pinterest.

Előnyök:
+ Könnyen skálázható bármilyen felbontásra

Hátrányok:
− Nehezen észlelhető tartalom (nehezen tanulható újra)
− Az oldal összes szakaszát teljes mértékben felül kell vizsgálni

A gyakorlat az én megoldásom

Megoldásomat a 4. megközelítésre alapoztam: egy képernyő kettővel aktív ablakok. A második ablak a hírnök. Ez lehetővé teszi a csevegést a hírek olvasása közben. 2 böngészőlap használata nélkül.

Kicsiben (<1440пк) экранах окно чата сворачивается.

Kívánt esetben a fő tartalom tetején nyílik meg. Ugyanígy működik a hírek olvasása közbeni csevegés is.

Maga a felhasználói panel a legfrissebb levelezéssel a képernyőn marad a webhely minden részében:

Részletek a színfalak mögött

Ha alaposan megnézi a képernyőképeket, más változásokat is láthat a felületen:

1. Háttér. Háttér került hozzáadásra a blokkok kontrasztjának növelése érdekében.


2. Blokkokra bontás. Az állásokat független blokkokra osztották.


3. A lájkok száma feljebb emelkedett. Talán a legvitatottabb változás, és valószínűleg külön tárgyalást érdemel.

4. Az előző felső menü eltűnt. Minden funkciója már megduplázódott a webhely egyes szakaszaiban. Helyette a füles szint volt. Így sikerült csökkenteni egy navigációs szintet. A szűrők (ritkán használt elem) átkerültek a legördülő listába. Egy másik navigációs szint hiányzik.

5. Két mód a barátok megtekintésére. Az egyik a webes verzióból, a másik a táblagépből van kölcsönözve. Nehéz felmérni, melyik a népszerűbb és kényelmesebb.


6. Személyes feljegyzések. Minden barátról személyes jegyzettömb jelent meg. Ha tetszik, szerezze be itt - VK Memos.

7. Webhívások. Korábban már VK-ban voltak, de külön működési módként készültek. Most ez egy láthatatlan funkció, amely nem zavarja az alapvető szörfözést és kommunikációt.


Utóirat helyett

Lehet-e újratervezni egy közösségi hálózatot a felhasználói oldal prototípusa nélkül?
A jelenlegi verzió tele van információval: zenék, videók, csoportok, nyilvános oldalak, fényképek, fotók térképen, fotóalbumok, barátok, közös barátok, online barátok, előfizetők... Úgy döntöttem, hogy levágok minden felesleges dolgot:


Ennyi, köszönöm a figyelmet.

Írnál az új dizájnról? Na végre!

!!! Figyelem!!! Általában azonnal figyelmeztetem, hogy nem csak felhasználóként, hanem tervezőként is értékelem a designt (beleértve a webhez kapcsolódóakat is), és nem csak magáról a tervezésről fogok sokat írni, hanem arról is, hogy miért van olyan sok elégedetlen. És sok levél lesz!

Hogy miért olyan szokatlan minden:

Alighogy április elsején (ami mindenkit erősen kételkedett a frissítés komolyságát illetően) elérhetővé vált az új dizájn korlátozott béta teszteléssel, azonnal felkerestem a VK blogot és kapcsolódtam. Ezután elkezdtem átugrani az összes részt, és néztem, mi történik. Az első napon körülbelül öt hibát találtam, amelyeket azonnal elküldtem az adminisztrációnak javításra. Az egyetlen dolog, amit nem javítottak ki, az az, hogy logikusnak tartják (az, hogy nem küldhetsz képet egy barátodnak pl. közösségből vagy hírfolyamból, majd mentheted el albumba. A logika az, hogy azt mondják, hogy te magad küldted, akkor minek menteni), de ez a dolog a múltban volt.

Ezt követően közzétettem a közösségemben az újratervezés összefoglalóját és egy szavazatot. Érdekes lett, hogyan reagálnak az első felhasználók. A legtöbben arra panaszkodtak, hogy nem találnak bizonyos funkciókat, például az üzenetekben található váltókapcsolót (amit könnyű megtalálni, ha az egeret a párbeszédpanel széle fölé viszi). Igen, az ilyen interfész elemek nagyon szokatlanok ahhoz képest, ami a RuNetben mostanában történt. De ez nem probléma az új dizájnnal. Ez egy probléma a RuNetben az elmúlt években megjelent tervezési gondolkodással. Nagyon ritkán készítünk progresszív és jó (!) designokat, amelyek kényelmesebbé válnak, és zökkenőmentesen és egyenletesen fejlődnek, lehetővé téve a felhasználó számára, hogy hozzászokjon az új elemekhez, amelyek intuitívabbak és UX-szempontból korrektebbek (a felhasználói élmény az interfész része tervezés, amely a felhasználó akadálymentesítéséért és kényelméért felelős). Ehelyett éles kiugrások vannak a legprogresszívebb fejlesztőknél, ami félreértési hullámot vált ki a felhasználók részéről. És mindezt hatalmas számú webhely hátterében, szörnyű kialakítással, ami kényelmetlen, de egyszerűen ismerős. És mindez azért, mert a webhelyek általában vagy olcsón készülnek, vagy az „így csinálják” elv szerint. Azok, akiknek van potenciáljuk és előre tudnak lépni, egyszerűen nem dolgoznak azért a pénzért, amit a RuNeten kínálnak, hanem jó és drága munkát végeznek külföldi srácokhoz. Ez az egész nagyon szomorú, és ezért az új VK dizájn bevezetése hasonlít a Rus keresztségére. De egy idő után a felhasználók megszokják, emlékeznek, hol változtak a dolgok, és megértik, hogy nem minden olyan rossz.

Arról, hogy "kaszálj a Facebookon, legalább van hírfolyamod mások lájkjai nélkül!"

Az tény, hogy a design fejlődik, és eddig optimálisnak számít, amit forma- és tartalomtervezésnek is neveznek. Nem sokkal ezelőtt fejlesztette ki a Google, és sokan felvették.

Ebben minden arányos elemeken és hangsúlyokon alapul, ami nagyon egyszerűvé és érthetővé teszi a fejlesztő ügyes kezében. Például ezek a panelek, amelyek profilja balra csúszik ki az alkalmazásokban, ez minden.

Emlékezzünk vissza, hogyan néztek ki ugyanazok a telefonok 10-15 évvel ezelőtt. Minden Nokia modell valami teljesen új volt: csúszó panelek, minden irányban összecsukható képernyők, a legőrültebb billentyűzetkiosztás – mindez nagyon klassz volt. Ugyanakkor nem emlékszem panaszra az új termékek megértésének hiányáról, minden olyan új, érdekes és klassz volt!

De a fejlődéssel minden egy egyszerű tányérra fogyott, amelynek tetején egy gomb, oldalán pedig kettő (vagy három hátul, mint az LGE). Most a termék vagy olyan, mint valaki másé, vagy új és érthetetlen. Most nincs értelme újra feltalálni a kereket, különösen, ha kevésbé lesz kényelmes, mint a már meglévő. Csak mostanra az eszközök és felületek tervezése, a webdizájn az optimumra jutott, és egyre nehezebb jobbat csinálni. A nagy gyártók nem olyan hülyék, hogy másolják egymást, hanem olyan okosak, hogy elfogadják a kényelmet meghatározó szabályokat, és végre közös koncepcióra jutottak.

Ugyanez vonatkozik a közösségi média tervezésére is. Az utolsó dolog, amit a fejlesztők szeretnének, az az, hogy közöljék velük, hogy ellopták a tervezést. Nem. Senki sem fog elítélni, ha több ezer székhez hasonló széket készítesz. Az Ikea pont ezt teszi: fájdalmasan banális, de egyszerű és jó dolgokat készítenek. Akkor mi a probléma a webdizájnnal?

Most itt van az én szubjektív „gondolatom” a legújabb VK-ról:

Jobb lett. Ez az igazság. A régi verzió olyan keveset változott, hogy inkább régi, 2000-es évekbeli tematikus fórumoknak tűnik, semmint modern közösségi hálózatnak. Most a mobil verzió és az alkalmazások sok hasonlóságot mutatnak az oldallal. Ez csodálatos. Logikai kapcsolat alakult ki közöttük. Eltűntek a közösségekből ezek a csúnya, több történetből álló avatarok egy fél oldalon „Feliratkozás” felirattal és így tovább. Mostantól kattintással ellenőrizheti az értesítéseket anélkül, hogy elhagyná az oldalt, ezek csak tetszésnyilvánítások és válaszok, nem pedig külön elmélkedés oszlopa. A válaszokat tartalmazó fotók megnyitva kiegészítik egymást, nem pedig a végtelenségig.

Az üzenetekről: Sokat kommunikálok VK-n (napi 5-20 párbeszéd), és ez az új formátum nagyon boldoggá tesz. Aki nem elégedett, könnyen átválthat a régi formátumra, ha a képernyő alján lévő fogaskerékre kattint, és módosítja a beállításokat. Mindenkinek boldognak kell lennie, nem?

Ugyanakkor egyetértek