Yandex designskole. Hvordan man opfatter skolematerialer korrekt

Yandex afholder som markedsleder regelmæssigt uddannelsesarrangementer om professionelle emner. I begyndelsen af ​​dette år lancerede de projektet "Yandex Design School" på Youtube. I videoformat taler eksperter fra Yandex om principperne og funktionerne i webdesign, analyserer forskellige eksempler og giver værdifulde teoretiske materialer.

Beskrivelse af den første serie videoer om design:

Videokursus for dig, der ønsker at udvikle sig inden for produktdesign.
For at bestå, skal du have grundlæggende erfaring inden for interfacedesign eller relaterede områder, sikker beherskelse af grafiske værktøjer og evnen til at designe interaktioner med grænsefladen, så den passer til opgaven. Derudover er det vigtigt at kende det grundlæggende i HTML, CSS og JavaScript for at lære.

Yandex Design Schools videokursusklasser er struktureret på en sådan måde, at eleverne gennemgår hele processen med at arbejde på et produkt: fra idé til lancering.

Programmet består af fire sektioner:
– Design i en stor virksomhed
– Prototyping
- Produkt design
– Teamwork

afspilningsliste

Mobile Design School 2016 startede for nylig.

Videokursus for interface designere, der ønsker at få yderligere viden og færdigheder i at skabe mobile produkter med et stort publikum. Baseret på foredrag fra School of Mobile Design, afholdt som en del af Mobiliseringsprojektet. Programmet omfatter foredrag om funktionerne i mobilt produktdesign, prototyping og animation samt teamwork. Videoer offentliggøres hver tirsdag fra den 18. oktober til den 13. december 2016.

Jeg kan varmt anbefale det til alle, der er interesserede i design.

En fremragende mulighed for at gå ind i et nyt erhverv. Derfor besluttede jeg at udføre en testopgave.

Opgaven består af to dele:

1. Tjek Yandex' mobilprodukter og foreslå et par ideer til at forbedre nogen af ​​dem.
2. Foreslå et koncept for en mobilapplikation til Yandex.Travel-tjenesten. Resultatet skal være et par nøgleskærme og en beskrivelse af, hvordan det virker og hvorfor.

Den anden opgave viste sig at være sværere, end jeg troede. Det ser ud til, at jeg lavede alle de fejl, jeg kunne, og det vil jeg tale om nedenfor.

Behandle

Jeg lærte om tilmelding på skolen lige før jeg tog til Jekaterinburg for at få DAMP. På vej i toget begyndte jeg at gennemtænke applikationsgrænsefladen og tegne skærme i en notesblok.

Dette var den første fejl. Jeg begyndte at bygge grænseflader, som jeg ville. Den rigtige ting at gøre ville være først at forstå, hvilke behov grænsefladen skal løse og bygge den derefter.

Da jeg vendte tilbage fra Jekaterinburg, havde jeg 12 dage til at udføre to opgaver som en del af testopgaven. For bedre at forstå tidens gang hængte jeg et stykke papir med dage foran mig for at huske deadline. Hver aften strøg jeg over den foregående dag.

Ikon

Brugeren stifter bekendtskab med applikationen, før den starter. App-ikonet betyder meget, så jeg startede der. Jeg tog ikonet for en allerede eksisterende Yandex.Travel-webservice som grundlag.

Jeg startede med at tegne et ikon i min:

Min anden fejl. Det ser pænt ud, men i virkeligheden nytter det ikke noget. Da jeg begyndte at tegne i Sketch, viste det sig at være fuldstændig lort:

Det rigtige ville være ikke at gentegne et eksisterende ikon, men at starte med de associationer, som tjenesten fremkalder. Yandex.Travel er en tjeneste til at søge efter ture og vælge hoteller.

Den første association, der kom til at tænke på, var et glas cocktail, det giver dig mulighed for at slappe af, som en tur til havet.

Jeg er enig, det ser patetisk ud. Selvom du endda kan bemærke Y'et fra Yandex-logoet. Denne mulighed er ikke egnet, da det ikke er en god idé at forbinde tjenesten med en alkoholisk drink. Næste rejseforeninger: palmer!

Jeg indså, at jeg havde lavet en fejl igen. Ja, jeg begyndte at tegne ikoner baseret på associationer, men de var i et vakuum. Det ville være mere korrekt at studere ikonerne for Yandex-mobilapplikationer, fremhæve almindelige funktioner og bruge dem i kombination med associationer til at tegne et ikon.

Hvem vil gerne acceptere sådan en freak i deres familie?

Yandex' applikationsikoner er enkle og har ikke for mange associationer. Til Transport har de en bus, til Post har de en kuvert, og til Marked har de en købmandsvogn.

Jeg begynder at lede efter simple associationer til Rejser: bagage, taske, billet. Mens jeg leder efter simple implementeringer af ikoner, støder jeg på et kompas. Faktisk er kompasset og dets billede kendt for alle. Jeg tegner et ikon og klæder det i firmafarver. Jeg tjekker, hvordan hun har det i familien:

Jeg husker, at halvdelen af ​​tiden før deadline er bag mig. Der er en uge tilbage. At tegne et ikon er ikke en let opgave. Jeg nøjes med muligheden med et kompas og går videre til mobilapplikationsgrænsefladen.

Til venstre er et ikon med kanter til en side med en liste over mobilapplikationer, til højre er et ikon til brug i en prototype, den skal ikke have kanter.

Ikonet føles godt i sit naturlige habitat:

Mobil app

Jeg åbnede Yandex.Travel på min smartphone for at se, hvordan mobilversionen af ​​webstedet ser ud. Dernæst installerede jeg følgende applikationer: Booking, Ostrovok, Travelata.ru, Aviasales og AirBnB for at se, hvordan grænsefladen kunne se ud i applikationer dedikeret til rejser og søgning efter hoteller/ture. Jeg installerede alle Yandex-applikationer til iPhone for at finde almindelige mønstre i grænseflader.

Jeg begyndte at lede efter skud på dribling i håbet om at finde interessante grænseflader og bruge dem som grundlag for mit koncept. Dette var min næste fejl.

Billederne i dribling viste sig at være skilt fra livet. De skærme, jeg fandt, var smukke, men de var i et vakuum og løste ikke problemet.

Bestemt, hvem der skal bruge Travel-mobilapplikationen. Først og fremmest er det de brugere, der allerede har brugt tjenesten gennem mobilversionen af ​​webstedet.

Overgangen til applikationen fra den mobile version af webstedet skal være så smertefri som muligt for brugeren, derfor skal grænsefladen være velkendt og velkendt.

Jeg tog grænsefladen til den mobile version af webstedet som grundlag og modificerede den, så den passer til den mobile realitet. Resultatet var en 8,7 MB skitsefil og 15 tegnebrætter:

I modsætning til mobilversionen har applikationen nu en side med et udvalg af personlige ture, muligheden for at tilføje søgeresultater til favoritter og en "Historik"-knap, som gemmer historikken for brugerens søgeforespørgsler.

Prototype

På dette tidspunkt indså jeg, at jeg havde lavet den største fejl under hele testopgaven.

Jeg tegnede grænseflader til skærmen på min gamle iPhone 4es for at demonstrere konceptets funktion på den. Da jeg åbnede applikationsbilledet for første gang, indså jeg, at størrelsen på tegnebrætterne ikke svarede til størrelsen på smartphone-skærmen.

I Sketch havde mine skærme dimensioner på 320 gange 480 pixels, men de havde brug for 640 gange 960. Jeg begyndte at lave alle skærme om. Så indså jeg, at elementerne ser godt ud i Sketch, men på en smartphone er de små.

Det ville være mere korrekt at gribe processen anderledes an: ikke "Tegn grænsefladen" → "Start prototyping", men tegn en skærm og tjek straks, hvordan den vises på en smartphone, hvilket ville spare et par dages arbejde.

Inden jeg startede testopgaven, besluttede jeg mig for et prototypeværktøj - Framer Studio. Der kan du skrive i CoffeeScript og lave fede animationer. Faktisk viste det sig, at det ikke var nemt at mestre Framers muligheder og implementere min grænseflade på den på kort tid. Der er ingen steder at gå hen, deadline nærmer sig, vi er nødt til at bøje.

I skolen nævnte Anton Shein InVision-tjenesten. Jeg begyndte at finde ud af det.

Tjenesten viste sig at være intuitiv: du uploader billeder og forbinder dem med overgange. Du kan tilpasse animationer til overgange, indstille dit eget programikon, som vil blive vist, når det gemmes på iPhone-startskærmen. Det er hvad jeg har brug for!

Prototyping proces i InVision

Der var nogle problemer. Jeg måtte kæmpe med statuslinjen.

Statuslinjen er en grænsefladelinje, der viser tid, batteriopladning og mobilsignal. Mine layouts havde deres egen statuslinje, men InVision kan vise systemet. Hvis du gemmer ikonet på startskærmen og starter programmet gennem det, smelter statuslinjen sammen med baggrunden.

Når vi gemmer webstedsikonet på startskærmen og starter det, åbnes webstedet via webvisningen. Statuslinjen kan konfigureres via metatagget Apple-touch-ikon. Desværre kan statuslinjen ikke konfigureres til at være gennemsigtig og have sort tekst. Kun med hvid tekst og sort baggrund.

Løsning på problemet: Installer InVision App og brug den til demonstration.

Da konceptet skulle vises gennem en anden applikation, blev demonstrationens integritet krænket. Jeg kom op med et scenarie: vis den kørende applikation, vend tilbage til ikonet, tal om det og vend tilbage til applikationen uden at klikke på ikonet.

Resultat

Σ

Ja, det glemte jeg helt at sige. Før testopgaven havde jeg aldrig arbejdet i Sketch. Som det viser sig, er det nemt at lære.

Det er meget sværere at skifte til mobilapplikationsdesign. Som webudvikler har jeg kun webgrænseflader i hovedet. Applikationerne har en helt anden use case og forskellige funktioner.

Hovedårsagen til, at jeg vil indskrive mig på School of Mobile Design, er for at få viden og erfaring med at skabe applikationsdesign, og lære at tænke som en designer.

Jeg har for nylig afsluttet Yandex.Design-kurset. Jeg studerede materialet på egen hånd. Men jeg havde ikke mulighed for at kommunikere med andre studerende, stille spørgsmål til undervisere, og det var svært at mærke stemningen på skolen.

Derfor vil jeg melde mig ind på Skolen for Mobildesign og personligt deltage i forelæsninger, stille spørgsmål og vigtigst af alt få erfaring med at skabe et produkt sammen med andre studerende.

Kun 30 personer vil blive accepteret, resultaterne vil blive offentliggjort den 27. maj. Tilbage er kun at vente på resultaterne og håbe på det bedste, men i mellemtiden kan du støtte mig ved at like og kommentere opslaget.

Jeg vil med glæde høre kommentarer og forslag til testopgaven.

Yandex åbner en Designskole - et projekt for håbefulde produktdesignere. Fra 15. juni til 31. august vil Yandex-medarbejdere og inviterede eksperter dele deres erfaringer med at arbejde med produktdesign med projektdeltagere. Uddannelsen består af fire blokke: "design i en stor virksomhed", "prototyping", "produktdesign" og "teamwork".
I slutningen af ​​programmet vil deltagerne præsentere et personligt projekt - en enkel og nyttig service, der konceptuelt og visuelt ville fortsætte rækken af ​​Yandex-tjenester.

Udvælgelsen til skolen foregik i flere etaper. Fra 18. marts til 19. april sendte ansøgere Yandex-teamet en portfolio, et essay og en prøveopgave. Forfatterne til de mest succesrige artikler blev interviewet. I alt kiggede skoleholdet på 780 ansøgninger og talte med 74 ansøgere. Selvom der oprindeligt skulle være 30 deltagere i projektet, var der én mere i den endelige opstilling.

Lola Kristallinskaya

souschef i designafdelingen

"Produktdesign til massetjenester bliver ikke undervist nogen steder i Rusland endnu, Derfor tiltrak skolen forskellige menneskers opmærksomhed: fysikere, ingeniører, matematikere, arkitekter, webdesignere og illustratorer skrev til os. Nogle arbejder og har sammensat en portfolio, andre studerer stadig og beslutter sig bare for, hvor de skal flytte videre.

I første omgang planlagde vi at tage 30 lyttere, men tallet er vilkårligt: ​​Hvis vi havde fundet 23 personer, ville vi have taget 23. Det var vigtigt for os at finde "vores egne" - passionerede og tankevækkende på samme tid. Helt fra begyndelsen formulerede vi et mål - udvælgelsessystemet skulle være gennemsigtigt, så vi klart kan forklare enhver person, hvorfor "ja" eller hvorfor "nej".

Det var vigtigt for oso finde"vores egen" - entusiastisk
og tankevækkende samtidigt.

Først og fremmest så vi på "bekymring": hvor seriøst en person nærmede sig at fuldføre testopgaven. Det var ikke en opdagelse for mig, at det at have erfaring eller en cool portfolio slet ikke garanterer præcist og meningsfuldt arbejde. Det er værdifuldt, når en person forstår, hvor han er på vej hen og er klar til at lære. Dette afhænger igen ikke af alder eller erfaring, men snarere af intern kultur og personlige mål. For eksempel trak nogle lovende kandidater sig tilbage efter en advarsel om, at de ville skulle studere hele sommeren: meget, lang tid, det ville være svært.

Vi reagerede på hver person, der skrev til os, talte med en masse mennesker og lærte en masse interessante ting om designermarkedet i Rusland, vi vil helt sikkert fortælle dig om det snart.

Undervisningen vil blive holdt hver anden dag om aftenen. Mentorer fra Yandex og personlige kuratorer vil overvåge deltagernes fremskridt. Da der ikke er nogen etableret metodologi og litteratur for produktdesignere i russisk designuddannelse, udviklede Yandex-medarbejdere projektprogrammet uafhængigt.

Taras Sharov

Leder af produktledelse og designafdeling

Yandex forventes at være objektiv og ikke-interfererende - dette krav om information påvirker også grænsefladen: at være et naturligt miljø, ikke en blanding.

PROGRAM

Design i en stor virksomhed

Om forskellen mellem skaberen og designeren. Om fordelene ved at studere relaterede erhverv. Fordybelse i arbejdet med brand-begrænsninger: visuelt sprog, arkitektur, historie. Hvordan man bidrager til et fælles værdisystem og bliver en del af noget større. Løsning af konflikten mellem personlighed og brand.

Prototyper

Den bedste måde at få en fornemmelse af produktet på er på designstadiet. En guide til at mestre prototyping-teknikker. At slippe af med frygten for at arbejde med kode. En systematisk tilgang til at organisere skabeloner og stilarter. Interface nedbrydningsmetodologi. Fælles terminologi med udviklere. Introduktion til interne Yandex-værktøjer.

Produkter

Produktionsprocessen fra idé til produkt. Roller: Produktchef, produktdesigner, teknisk arkitekt og marketingmedarbejder. At transformere en UI-designer til en produktdesigner. Stadier af designprocessen og værktøjer til hver af dem. Test af hypoteser: forskning og eksperimenter. Promovering af et produkt efter dets oprettelse.

Samarbejde

Hvorfor er det vigtigt at samle et team af forskellige, ligesindede mennesker omkring dig? Sådan organiserer du dig selv og andre. Gruppebeslutninger og deres gennemførelse uden forvrængning. Korrekt adfærd i typiske konfliktsituationer. Teknikker til at formidle ideer til andre. Specifikt for et stort team: deadlines, møder, kritik, kvalitetskontrol, respekt og tillid.

Projekt arbejde

For effektivt at gennemføre kurset er det nødvendigt at engagere sig ikke kun i teori, men også i praksis. Skolens deltagere arbejdede på deres egne produkter - vi tilbyder en lignende opgave til videokursets elever. Du kan lære mere om det fra