So You Wanna Make Games?? | Episode 9: User Interface Design

แชร์
ฝัง
  • เผยแพร่เมื่อ 12 ธ.ค. 2018
  • Many games require you to have immediate access to a ton of critical information like stats, inventory, mission info, and location. Being able to easily access that info when you need it-and only when you need it-is the result of UI designers working very closely with user experience designers. In this video we review the difference between UX and UI design and hear from visual designers and motion graphics artists about some core considerations for designing UI and ensuring a game experience is consistent, cohesive, and immersive.
    Visit our website for additional resources: www.riotgames.com/en/artedu/u...
  • เกม

ความคิดเห็น • 280

  • @hikazeyattis3828
    @hikazeyattis3828 4 ปีที่แล้ว +182

    *Game Developer gets introduced"
    Music: ~~~DUBSTEP BASE~~~

    • @wowa810
      @wowa810 3 ปีที่แล้ว +2

      I made some facepalms but the video was so interesting I forgave them

  • @RazDorNV
    @RazDorNV 5 ปีที่แล้ว +756

    "The real art is knowing which mistakes to keep."

    • @softtiger592
      @softtiger592 4 ปีที่แล้ว +9

      Such a good thought.

    • @tobyconoley5511
      @tobyconoley5511 4 ปีที่แล้ว +3

      Although it's better not do or keep any mistakes if you can

    • @frederikferguson2571
      @frederikferguson2571 4 ปีที่แล้ว +31

      @@tobyconoley5511 but what if somthing which starts out as a mistake actually makes the game work or simply look better

    • @SrSeed
      @SrSeed 4 ปีที่แล้ว +71

      Thats why my mom kept me

    • @sweeren3619
      @sweeren3619 4 ปีที่แล้ว +5

      @@SrSeed LMFAO

  • @mohinator3341
    @mohinator3341 5 ปีที่แล้ว +496

    This content it's so high quality, why there are so few people?

    • @Finalshadic
      @Finalshadic 5 ปีที่แล้ว +11

      Well, for the whole series, they have got almost 50 people. I think that is a lot of effort already :D

    • @sebastiansoler4180
      @sebastiansoler4180 5 ปีที่แล้ว +42

      @@Finalshadic I think he means that the video isn't recieving a lot of atention. Like, there aren't even 40 comments in this video

    • @dallassegno
      @dallassegno 5 ปีที่แล้ว +3

      it's a diversity profile. believe ever it or not

    • @amurika6336
      @amurika6336 4 ปีที่แล้ว

      Bc this industry is very competitive and designing is getting easier and easier.

    • @EvilNinjaPokerBunny
      @EvilNinjaPokerBunny 4 ปีที่แล้ว

      cant trust videos that use fortnite as an example.

  • @guiguiregismercer5720
    @guiguiregismercer5720 3 ปีที่แล้ว +198

    as a graphic designer student artist I found this sooo amazing

    • @jessicarichardson8661
      @jessicarichardson8661 ปีที่แล้ว +6

      If graphic design students find this video useful no wonder UIs are so bad in games these days.

    • @daisynavarro15
      @daisynavarro15 ปีที่แล้ว +2

      @@jessicarichardson8661 dude for reals, they been lazy with alot of games

    • @Balloonbot
      @Balloonbot ปีที่แล้ว +3

      @@jessicarichardson8661 Huh? Graphic design is the fundamentals of UI my friend, not sure what you're talking about.

  • @hazelmaltasanti7037
    @hazelmaltasanti7037 5 ปีที่แล้ว +235

    Why isn't TH-cam flooded with more content like this?!

    • @prezadent1
      @prezadent1 4 ปีที่แล้ว +12

      You want to sit around a watch how it's done or do you want to open up the software and get it done?

    • @NUKELEDGE
      @NUKELEDGE 3 ปีที่แล้ว +15

      @@prezadent1 both are valid, you can't get into a program and start doing UI if you don't even know what UI is

    • @razor191919
      @razor191919 3 ปีที่แล้ว +7

      Doesn't make people angry, happy, or sells a product.

    • @mancamiatipoola
      @mancamiatipoola 3 ปีที่แล้ว +10

      YT is flooded with every content in the world. The trick is knowing what to look for and grabbing that.

    • @darkreaper4990
      @darkreaper4990 2 ปีที่แล้ว +5

      @@prezadent1 I don't care if it's a 2 year old comment. I am just sick of seeing comments like this. I used to 100% believe in the diving blind philosophy but not anymore. As I dabbled into a lot of completely different unrelated subjects, I found that there were always better ways of doing things rather than just going in blind. a thorough research, getting the basics right and internalizing them before diving in saves you from a lot of headache and, most importantly, time down the line.

  • @SKinSKorea
    @SKinSKorea 4 ปีที่แล้ว +99

    Sonia here, from 홍익대 (Hongik University) in South Korea, one of the top schools here for Art and Design. This semester I was given a class (that I didn't ask for) outside of my knowledge base-- English for Games Graphics Design Majors. I reached out to some of the major professors before the semester started, and several responded by sending me their syllabi and course content (and interesting articles). Of course, I also did a lot of internet searching on my own so that I could get a basic understanding of (and appreciation for) GGD and teach in some context. (I am a 50-something year old woman whose gaming career started with Pong and ended with Ms. PacMan). I have found this series to be life-saving (OK, maybe not, but let's say class-saving!). SYWMG is basically my textbook! The subtitles are on-spot, so students with lower level listening abilities can read along. The graphics are helpful for visual learners (also, for teachers like me who need to connect the words to their concepts), and the length is perfect. I cannot thank you enough for creating these and putting them out there for me to find and use!

  • @vancitysyd
    @vancitysyd 7 หลายเดือนก่อน +6

    The advice at the end brought me so much comfort I can’t even explain

  • @lowhp_comic
    @lowhp_comic 4 ปีที่แล้ว +46

    UI design looks sooo cool and fun to do, the UI in Persona 5 was so f*cking fantastical and eye catchy and I've always loved the HP bar shape in Kingdom Hearts

  • @arsenyprokhorenko8649
    @arsenyprokhorenko8649 3 ปีที่แล้ว +15

    Three years have passed, and it is still freaking useful!

  • @StevenOggVIDEOS
    @StevenOggVIDEOS ปีที่แล้ว +4

    I just found this series a couple days ago and I love it so much. I want to get into the games industry but had a hard time pinpointing exactly what I'd like to do and this series gives a great overview of a bunch of different roles and advice. Thanks riot!

  • @BobbyBrixx
    @BobbyBrixx 5 ปีที่แล้ว +19

    My favorite episode so far, thank you Riot Games.

  • @abdullahbinjs2236
    @abdullahbinjs2236 3 ปีที่แล้ว +5

    Fantastic video. I always liked topography and UI design, and your video really opened the doors for me to explore visual arts now that I have a much better understanding of it in such a familiar context. Great job, you're gonna blow up someday (hypothetically, of course).

  • @franckdinoia2060
    @franckdinoia2060 3 ปีที่แล้ว +2

    Hi, i just want to say "thank you so much for these videos". I'm a french student in a video game school and your videos are so helpfull. I'm working on my last project with my team to finalize our studies, but with the covid we are currently alone without help , so we do our best to learn and skillup for our student game. Your stuff helped me to make my decision to start without any art skills 4 years ago, and now your stuff helps me to finalize my studies and maybe start to work in this industry. So you're right, you should never be afraid about trying, if you want to get in, start working on it now, it's only time and efforts. Thank You Riot

  • @faithli9719
    @faithli9719 2 ปีที่แล้ว +13

    I'm a graphic designer trying to get into the game industry. Though I found this video two years later, still gained a lot of useful knowledge from it. Thank you so much for this amazing video!

  • @ahmerwaqar.artist1673
    @ahmerwaqar.artist1673 4 ปีที่แล้ว +3

    This video is fantastic - it’s answered all my burning questions in a fun and engaging way. Thanks so much!

  • @janelchang7196
    @janelchang7196 4 ปีที่แล้ว +3

    Thank you for uploading this information! It is easy and straight forward about the UI design. Before that, I thought that the UI designer create the interactive interface page, after that the UX designer will test on it to see if the UI is functional or not.

  • @riddick1168
    @riddick1168 4 ปีที่แล้ว +23

    10:33
    Good artists copy and great artists steal
    PICASSO ✍️

  • @hattrickster33
    @hattrickster33 4 ปีที่แล้ว +26

    Just wanted to say thanks for making this. As a web developer (and gamer), I found this really useful.

  • @marijhayaa8268
    @marijhayaa8268 4 ปีที่แล้ว +6

    Thanks for this!
    I’ve been trying to get work as a UI Artist for soo long. Been getting interviews, passing art tests, but I think I failed every time I got asked ‘what I think’ UI is 😂, I don’t think I understood UI properly.
    👍🏼👍🏼👍🏼 thanks again

  • @MrFarkasOfficial
    @MrFarkasOfficial 3 ปีที่แล้ว +3

    You offer the world gold content and the algorithm gives you dirt. Very underrated channel.

  • @MH-lr6ue
    @MH-lr6ue ปีที่แล้ว

    Thank you for taking the time to let us know what games you referenced cuz I definitely looked a few of them up and thank you for this awesome content I'm learning so much

  • @valia
    @valia 4 ปีที่แล้ว +1

    Crazily informative. Love this vid. Thanks!

  • @michaelodetola
    @michaelodetola 5 ปีที่แล้ว +10

    Great video. I don't usually comment but this was pretty solid advice.

  • @secretcode7
    @secretcode7 2 ปีที่แล้ว +1

    The drawings in this are A+ superb

  • @drewthermos3866
    @drewthermos3866 3 ปีที่แล้ว +2

    Great video and content. Answered a lot of questions I had and opened doors to new avenues I plan to pursue.

  • @tonlimcmu
    @tonlimcmu 3 ปีที่แล้ว +3

    thank you for the last part that make me feel alive.

  • @MrRuslanbykov
    @MrRuslanbykov 4 ปีที่แล้ว

    What an amazing people! Thank you guys!!!

  • @skydyleyw0037
    @skydyleyw0037 3 ปีที่แล้ว

    oh my god the perfect informational video, i praise you my good sir and everyone that was included in this vidso!

  • @marcagdon6446
    @marcagdon6446 2 ปีที่แล้ว

    searched for "Game Design Mockups" WHILE launching Valorant. Didn't Know rito is posting these kind of videos beside the vlogs i've read about TFT, LoL and WR. Thanks for your games and awesome videos!

  • @yahlimendler2898
    @yahlimendler2898 5 ปีที่แล้ว +5

    Love these!

  • @Cauks1
    @Cauks1 4 ปีที่แล้ว

    The video starts with MECHA TARGETING SYSTEMS. Instant subscribe

  • @Paramitacdewi
    @Paramitacdewi 3 ปีที่แล้ว +1

    This is so well explained even for me who just wants to know about UI in general

  • @austencourpet
    @austencourpet 4 ปีที่แล้ว

    Thanks for the great interviews

  • @mygamedev9735
    @mygamedev9735 5 ปีที่แล้ว +1

    Really Great Work, Thank you

  • @cptray-steam
    @cptray-steam 3 ปีที่แล้ว +2

    Yo what? A great game developer making free tutorials on TH-cam? That's awesome! Thanks for this video.

  • @drljubica1
    @drljubica1 4 ปีที่แล้ว

    These videos are gold!

  • @DreamRice
    @DreamRice 5 ปีที่แล้ว +10

    Loved it! Will we be getting a video to the topic of UX as well? Would love to watch it!

    • @crazyperson123
      @crazyperson123 3 ปีที่แล้ว

      Sadly they never made an episode on that...

  • @user-bk7nr6id9d
    @user-bk7nr6id9d 3 หลายเดือนก่อน

    I loved this - "Trying is half the battle. You should never be afraid of trying. Cause once you've done it, you've taken the biggest step. And from that point on, it's just a matter of polishing it."

  • @DesignedByTaz
    @DesignedByTaz ปีที่แล้ว

    We need more content like this!!!

  • @zenitaly
    @zenitaly 4 ปีที่แล้ว +3

    The UI of this video is very good.
    Thanks for yhe great UX i had watching the video. 😆

  • @ErinTheGameDev
    @ErinTheGameDev 3 ปีที่แล้ว +1

    Thanks for this! I really needed some help with the UI on my sloth MMORPG

  • @gabrielegrioli1414
    @gabrielegrioli1414 5 ปีที่แล้ว +4

    This is so good!

  • @plagues90
    @plagues90 4 ปีที่แล้ว

    Love it.
    I keep watching it

  • @arbykov
    @arbykov 4 ปีที่แล้ว

    Great videos, thanks for making them!

  • @aceito9966
    @aceito9966 5 ปีที่แล้ว

    Love this series

  • @moldyloaf774
    @moldyloaf774 4 ปีที่แล้ว

    You made it easy to understand. Thank you.

  • @design_with_dana
    @design_with_dana 11 หลายเดือนก่อน

    So inspiring and informative!😍 Thx!

  • @WalterHMay
    @WalterHMay 5 ปีที่แล้ว +2

    Thank you for the inspiration.

  • @strangeworld7100
    @strangeworld7100 3 ปีที่แล้ว

    Incredible video, it will help a lot!!! Thanks

  • @7amdan.7amid
    @7amdan.7amid 18 วันที่ผ่านมา

    Tyy for sharing this great content!

  • @attilaramirez3147
    @attilaramirez3147 ปีที่แล้ว

    this video is amazing, well explained

  • @marcdandoy9841
    @marcdandoy9841 4 ปีที่แล้ว +7

    One of my dreams as a teen was to be a UX/UI designer for Riot

  • @_sparrowhawk
    @_sparrowhawk 3 ปีที่แล้ว

    Great video, wow your team rocks

  • @ClaimScout
    @ClaimScout 2 ปีที่แล้ว

    What a killer video!

  • @omegablast2002
    @omegablast2002 4 ปีที่แล้ว

    Wonderful talk!!!

  • @Elesnouman
    @Elesnouman ปีที่แล้ว

    I believe that on a non techical level this videos are great. Especially for those programmers that are not familiar with design.

  • @jaytakajeremiahtisdale2042
    @jaytakajeremiahtisdale2042 3 ปีที่แล้ว

    11:35 that’s the part that resonated with me the most

  • @adudeontheinterweb6571
    @adudeontheinterweb6571 3 ปีที่แล้ว

    singlehandedly made a better and higher quality video that ACTUAL Game engine companies

  • @konichiwatanabi
    @konichiwatanabi 3 ปีที่แล้ว

    "real art is knowing which mistakes to keep" niiice

  • @katielingham5385
    @katielingham5385 3 ปีที่แล้ว +3

    This is so insightful! Im an artist who is trying to find their nishe in games. I think UI is looking like it!

  • @danielperalta4375
    @danielperalta4375 2 ปีที่แล้ว

    love this video

  • @bakunincervantes4372
    @bakunincervantes4372 2 ปีที่แล้ว

    Good stuff in here!

  • @palewine
    @palewine 4 ปีที่แล้ว

    Super helpful content.

  • @suhee-bae
    @suhee-bae ปีที่แล้ว

    I am currently a Junior UI/UX Designer with a video production background, and this video with all the advice at the end really inspired me to never give up on getting into my dream company - Riot! :) As an international, I know I need to take a step further than US citizens, and I know it's a long way to go. But I hope that one day I will be at Riot and come back to see my comment!
    To Future Me: How's working with Riot? LOL :D

  • @angelicad.1647
    @angelicad.1647 3 ปีที่แล้ว

    This is GOLD.

  • @ssenadokmeci
    @ssenadokmeci ปีที่แล้ว

    it was amazing, thank you so much

  • @shangoat2008
    @shangoat2008 5 ปีที่แล้ว +49

    I can't get the image of the Indian guy with super big eyes telling me 'go work on something, right NOW' out of my head...

    • @nuklearboysymbiote
      @nuklearboysymbiote 4 ปีที่แล้ว +1

      JUST DO IT! MAKE YOUR DREAMS COME TRUE!!

    • @mancamiatipoola
      @mancamiatipoola 3 ปีที่แล้ว +1

      I know, it's like an alien poorly disguised as a human giving you better advice on human things than any human ever did. He is truly a cool alien guy. :)

  • @count505
    @count505 5 ปีที่แล้ว +3

    What is the song @8:24 ?

  • @beez-iq5273
    @beez-iq5273 2 ปีที่แล้ว

    Super Useful thanks alot

  • @bingkunhan5408
    @bingkunhan5408 5 ปีที่แล้ว

    Love it!

  • @Enorday
    @Enorday 3 ปีที่แล้ว +3

    thank you for the advise, but the problem i have is that i cannot decide which specialziation i wanna take, animation, modeling, coding, level design, ui, texturing, etc.. is all interesting

  • @carhively7
    @carhively7 ปีที่แล้ว +1

    Where do you practice this? What tools do you use? Do you just recreate the screens on something like Figma or is there a specific tool needed?

  • @nothingheretowatch7371
    @nothingheretowatch7371 3 ปีที่แล้ว +1

    thanks guys

  • @HW-lg1qs
    @HW-lg1qs 3 ปีที่แล้ว

    I love this video!

  • @TheAlnitak10
    @TheAlnitak10 3 ปีที่แล้ว

    I chosen move from printings graphic design to UI/UX in this year. I really anxiety to intro in game industrie. I almost 30 yo now, everything seems big to me but I want to try, I want this because I love games!

  • @gabrielwillames
    @gabrielwillames 3 ปีที่แล้ว

    great vid!

  • @phantomslayer9714
    @phantomslayer9714 2 ปีที่แล้ว

    Good artist copy Great artist steal . I have learnt a lot .

  • @araeswhiteflag
    @araeswhiteflag ปีที่แล้ว

    3:46 - thank you for using stellaris. this game is so, so good ; ;

  • @wanderingworld762
    @wanderingworld762 5 ปีที่แล้ว

    Riot Games, you rock!

  • @Danklovic
    @Danklovic ปีที่แล้ว

    wtf finally found a great and hidden series

  • @christianbrenner984
    @christianbrenner984 3 ปีที่แล้ว +2

    The only game from Riot Games that I tried to play was Valorant. After some minutes in the tutorial, I was kicked out of it and the game displayed a modal dialog with a numerical error code and no further explanation. The only option was to click the button, which caused the game to close. This was reproducible consistently.
    There was a list with error codes on the web pages of Riot Games, but the one that I got wasn't even listed. I found the error code in some web forums and found out that there can be a number of reasons that lead to the same code (!). The issue was probably related to their anti-cheat solution and might be caused by unsigned drivers or other software installed on the PC. I tried a number of solutions proposed by users on the internet and then gave up after some hours. I later retried with a newer version of Valorant, where the only change was that it displayed a different error code.
    Regarding UX, I would have expected the dialog to show a human-readable text that explains the exact cause of the issue, including the specific software that "causes" the problem (while the actual cause of the problem is the anti-cheating program misidentifying a driver as some kind of cheating software).
    In case the specific "suspicious" software can't be known by Valorant (which I doubt), I would have expected at least a human-readable text identifying the anti-cheat technology as the cause of the issue. While I don't see why you wouldn't display a human readable text at least in addition to the error code, the code should at least be specific and not be the same code for several possible problems. Obviously, the code should be documented on the web pages.

  • @PaElRa
    @PaElRa 5 ปีที่แล้ว +8

    I want to be a designer at Riot!

  • @SaNaLk
    @SaNaLk 3 ปีที่แล้ว

    mn oya software eka goda kaalayak use karanawa superb

  • @bobans
    @bobans 2 ปีที่แล้ว

    OMG, OMG, OMG, I am having an interview tomorrow for the role of UI Visual Designer, just passed the creative test! I'm so pumped because I love gaming, art, and UI, it will be my dream job.

    • @age9502
      @age9502 2 ปีที่แล้ว

      What happened next mate?

    • @bobans
      @bobans 2 ปีที่แล้ว

      @@age9502 They said they wanted someone with more experience.

  • @riftoaster
    @riftoaster 4 ปีที่แล้ว

    Question: what authoring software do you use for UI Design in video games? Both Adobe Flash and Autodesk Scaleform are no longer supported. Unreal Engine has their UMG and Blueprints model, but not every developer uses Unreal.

  • @DaiTrader
    @DaiTrader 4 ปีที่แล้ว

    Dear Riot Games,
    I want to wireframe a 2D top-down MMO (like The Escapists 1/2). Do you have any recommendation which Wireframe tool to use in that particular case (Sketcher, Figma, Balsamiq, inVision, ...)? In the end, the game should look something between the games you showed in this video min. 0:08 - 0:09 and 8:46 - 8:53.
    PS: Could you please tell me the names of these two games? Thx a lot, keep up the fantastic work. And thank you for this series of videos.

  • @morganlak4337
    @morganlak4337 2 ปีที่แล้ว

    Shout outs to people who actually enjoy UI design, I absolutely hate working on that shit 🙌 but boy do I appreciate good ones made by people who care

  • @igorthelight
    @igorthelight 5 ปีที่แล้ว +3

    8:17 - Great name for an Elder God :-)

  • @komalvishwakarma9740
    @komalvishwakarma9740 ปีที่แล้ว

    Gold!!!

  • @Juan-lj4pi
    @Juan-lj4pi 3 ปีที่แล้ว

    I don't know if that dubstep drop was sarcasm but it was fucking hilarious

  • @artsubby
    @artsubby 3 ปีที่แล้ว

    This is the video for the UI designers to refer to.

  • @Ptoogeez
    @Ptoogeez ปีที่แล้ว +1

    Nice video

  • @kalonpeng5734
    @kalonpeng5734 4 ปีที่แล้ว

    added to my favor list !!Riot!!

  • @RaulVillalobos
    @RaulVillalobos 5 ปีที่แล้ว

    why is the dude in the bro fist tee peeling his eyes so hard

  • @herrypunsh310
    @herrypunsh310 5 ปีที่แล้ว

    thank you♥

  • @geeksinux
    @geeksinux 4 ปีที่แล้ว +1

    Which tool used for gaming UI design?

  • @mangeshursal6295
    @mangeshursal6295 2 ปีที่แล้ว

    wow thanks a lot amazing

  • @velvetypotato711
    @velvetypotato711 2 ปีที่แล้ว +2

    what software do you use

  • @ahriko
    @ahriko 5 ปีที่แล้ว +1

    wanna know more about game UE design, plz .....

  • @gomimav4804
    @gomimav4804 5 ปีที่แล้ว +4

    Hi Riot :3