Designing the UI for my Farming Game

Sdílet
Vložit
  • čas přidán 31. 05. 2024
  • Devlog video about "Homegrown", a casual farming game I'm creating using my own engine.
    Play my previous game "Equilinox":
    store.steampowered.com/app/85...
    Support the channel on Patreon and get access to the game & code for Homegrown, the city-builder, and Equilinox:
    / thinmatrix
    UI database website: www.gameuidatabase.com/
    Flat icons: pictogrammers.com/library/mdi/
    You can follow the progress of the game on my social media:
    Twitter: / thinmatrix
    Instagram: / thinmatrix
    Facebook: / thinmatrix
    Trello: trello.com/b/W3zkIJTM/farm
    Email: thinmatrix@gmail.com
    Background music by Jamal Green:
    open.spotify.com/artist/50jTM...
    Outro music by Dannek Studio:
    / dannekstudio
    #devlog #Homegrown
  • Hry

Komentáře • 347

  • @ladontetaylor4009
    @ladontetaylor4009 Před 6 měsíci +528

    I've been watching you since I was 13-14 man, and now I'm 20. Thank you for just motivating me, and the game looks amazing.

    • @dylkirbs
      @dylkirbs Před 6 měsíci +28

      This channel was one of my biggest inspirations in life and definitely contributed to me studying computer science

    • @Jiftoo
      @Jiftoo Před 6 měsíci +6

      Hey man, same. Trying to make my own game is what really hooked me on to programming.

    • @-N0PE-
      @-N0PE- Před 6 měsíci +2

      This.

    • @konjecture
      @konjecture Před 6 měsíci +5

      Keep watching for another 10 years and you will be 30, if my math is correct.

    • @razmatazz9310
      @razmatazz9310 Před 6 měsíci +5

      @@konjecture Let me crunch those numbers...yep, looks like you are correct.

  • @sebastianprice9496
    @sebastianprice9496 Před 6 měsíci +220

    Im sure enough people have said this but the UI looks amazing so far and I love the fact colours can be changed. It would be so cool if we could do this in the game as a setting and apply our own custom colours. Love the progress and I look forward to seeing the next devlop. Keep it up :)

    • @pixobit5882
      @pixobit5882 Před 6 měsíci +3

      Yeah, exactly my thoughts!

    • @roeyshapiro4878
      @roeyshapiro4878 Před 6 měsíci +13

      Or depending on the time of day they change!

    • @alexisbrin518
      @alexisbrin518 Před 6 měsíci +9

      why not have some reward or quest to complete that gives you more choice in the colors of UI you can choose from

    • @ConnerWithAnE_
      @ConnerWithAnE_ Před 6 měsíci +4

      @@alexisbrin518yea that’s a great idea, like unlock different colours

    • @retrojon_
      @retrojon_ Před 6 měsíci +2

      @@alexisbrin518 Not being able to change the colors to whatever you want from the start presents a usability issue for those who experience some level of color blindness. The idea of unlocking colors sounds cool but since this affects UI, it's probably best to avoid it.

  • @cats4president
    @cats4president Před 6 měsíci +125

    i really like the color scheme system you made, especially when you were switching between them (blue > brown > lightblue)
    to me, it immediately felt like you were switching to a different season. the darker greenish blue would be a nice winter color and the browns for autumn.

    • @d0tt
      @d0tt Před 6 měsíci

      I was looking for this comment, instantly felt the same and think it would really cool to switch them with the seasons changing :)

    • @dcprom0396
      @dcprom0396 Před 24 dny

      Would be a nice option for the player so they can choose between different color schemes.

  • @MariamaDiallo-fj6ow
    @MariamaDiallo-fj6ow Před 6 měsíci +108

    It would be cool if the transition from the farm to the town was in the style of the cloud like shapes in the UI

    • @RobGThai
      @RobGThai Před 6 měsíci +3

      Something like The Simpson intro sounds wonderful. However, do consider how often this will get used. Such detail transition required times for people to perceive and might not fit how often we need to see it. If a game flow required me to visit the town often then it might be annoying. Need to find that balance.

  • @jamesbaconreid
    @jamesbaconreid Před 6 měsíci +19

    Designer here. Keep the cell shading, thats great. Small dark circles around the inventory numbers. The white text on the green was still readable. Keep going in this direction!

    • @jamesbaconreid
      @jamesbaconreid Před 6 měsíci +5

      Also for the fertilizer buttons, keep the design it's great, just scale down the tag.

  • @kr15t14n_
    @kr15t14n_ Před 6 měsíci +79

    Remember that simplicity is the ultimate sophistication

    • @TheThirdPrice
      @TheThirdPrice Před 6 měsíci +2

      Ahh, the anti-wintergaten theorem

    • @klaxoncow
      @klaxoncow Před 6 měsíci +6

      "A designer knows he has achieved perfection not when there is nothing left to add, but when there is nothing left to take away."
      - Antoine de Saint-Exupery

  • @lucbloom
    @lucbloom Před 6 měsíci +18

    Text with a solid high contrast backing is preferable to throwing an outline on it with that color, legibility wise. (So make it an inventory counter *circle* instead of a number + outline)

  • @JuanTarallo
    @JuanTarallo Před 6 měsíci +33

    Looks awesome. Very clean and suits the overall style.

  • @KingPr0o7
    @KingPr0o7 Před 6 měsíci +3

    I have the same feeling of “What makes a UI look good?” It’s the biggest thing for me as a Website Developer.. Glad to see I’m not alone.

  • @SebbyGraves
    @SebbyGraves Před 6 měsíci

    "I've been working on it so long I've lost the ability to look at it objectively." I feel this every time I do world design or UI design for long periods of time. Always great to have other people give you unbiased notes.

  • @natecraver6362
    @natecraver6362 Před 6 měsíci +1

    I definitely like the more imperfect design for the buttons/icons. Makes the game look a bit more cozy, for lack of a better word. Would be neat if the player could make/choose there UI own UI Color Schemes.

  • @pineapplerindm
    @pineapplerindm Před 6 měsíci +34

    7:07 - for the fertilizer tags, maybe it'd help if you made the text colors a darker version of the current background, and the background much lower opacity (or blended more with the parent container's background). That should maintain contrast while reducing attention to them
    also - the headers for each statistic ("Contents:", "Fertilizers:") may look nicer without the colon as they are headings anyways. To make them look more like headings without the colon, increase their font size & bottom margin. another thing that might help with distinguishing between headings and normal text is to make headings look _more_ contrasting against the background by making normal text _less_ contrasting against the background
    finally I really wish Dosis had a monospace (tabular) numbers OpenType feature for numeric values...nothing much can be done about that...
    overall the ui looks really good and fits the "cleanliness" of the game's artstyle :)

    • @ThinMatrix
      @ThinMatrix  Před 6 měsíci +9

      Thanks for the suggestions!

  • @samuelhulme8347
    @samuelhulme8347 Před 6 měsíci +1

    UI looks better than what I could do. Also Shneiderman’s 8 “golden rules” of UI could help you.

  • @larryd9577
    @larryd9577 Před 6 měsíci

    Considering, that currently no sky is visible, I really like that you have chosen clouds as accents, that balances it out.

  • @GuildOfCalamity
    @GuildOfCalamity Před 6 měsíci +1

    Dude loves the workspace selfies. Game's looking really nice.

  • @FMontanari709
    @FMontanari709 Před 6 měsíci +4

    4 years since the city builder already? Feels like yesterday to me, time sure flyes by!

  • @PengiiiiGameDev
    @PengiiiiGameDev Před 6 měsíci +4

    It is a good dayyyy!!!

  • @Domex122
    @Domex122 Před 6 měsíci +6

    the UI Colour could maybe be a option in the settings that players can change them self if they want

  • @NewEnglandModz
    @NewEnglandModz Před 6 měsíci +1

    I think the cell shading looks nice for the icons despite the models in-game not having cell shading. It fits the UI thematically

  • @andyloveridge7485
    @andyloveridge7485 Před 6 měsíci

    I absolutly love that navy blue color scheme it feels so fresh and pops

  • @Datdus92
    @Datdus92 Před 6 měsíci +1

    Graphic designer here with some feedback: The buttons with text could use a little more padding. It will be easier to read and will look less cluttery. love the faux drawn icons!

  • @johnosei826
    @johnosei826 Před 6 měsíci +2

    Always nice to see these devlogs. Some of the best!

  • @stickzman
    @stickzman Před 6 měsíci

    Nice call on adding the little accents to the bubbles, it does help give the UI some personality

  • @CoderDev6545
    @CoderDev6545 Před 6 měsíci +19

    This is a long awaited update! Fantastic job!

  • @Haapavuo
    @Haapavuo Před 6 měsíci +1

    Looking good! I recommend removing the boxes from the hotbar totally and perhaps adding a single wide element as the background. The slots would still be there but a bit less visible 👌

  • @Rhys510
    @Rhys510 Před 6 měsíci

    Looking great, I'm always so drawn in with your videos!

  • @LifeOfMohammed
    @LifeOfMohammed Před 6 měsíci

    Looks amazing as always man so happy to see how far this has come!

  • @theyeetgamer7787
    @theyeetgamer7787 Před 6 měsíci +12

    THIS IS AMAZING! This guy is someone i wait excitedly to upload cause i love his content and just love all around😁

  • @hamzahgamedev
    @hamzahgamedev Před 6 měsíci +4

    What a timing ❤
    I was about to start implementing UI for my own open world farming game and I can’t believe you uploaded a video about it. Thank you so much and this looks absolutely amazing 😍😍

  • @diegochequer
    @diegochequer Před 6 měsíci

    You’re slowly motivating me to start out and make some small games just for educational reasons. Love your content

  • @tropicallion9662
    @tropicallion9662 Před 6 měsíci

    Amazing work like always! I so can't wait to play another amazing game from you. This one is my fav as i love gardening and always wanted a game that is like this!

  • @incM14
    @incM14 Před 6 měsíci +15

    The colorscheme at 11:37 looks the best in my opinion.

  • @phoenix05892
    @phoenix05892 Před 5 měsíci

    There's always so much work that goes into the little things that people look over. UI is absolutely one of these things. Glad there's a video discussing the process that goes into it!

  • @360McCarthy
    @360McCarthy Před 6 měsíci +9

    As always amazing! My partner has recently started a UI UX course so she has found this fascinating also, can't wait to see more!

  • @relucri
    @relucri Před 6 měsíci

    Always a pleasure to see progress. Loving the new UI.

  • @NotGeri
    @NotGeri Před 6 měsíci

    It looks so good! Super clean, and so very pleasant to look at. I'm so hyped for this game!

  • @ramoncf7
    @ramoncf7 Před 6 měsíci +2

    I think you've done an excellent job with the design but also setting the foundations for future changes. Cell shading looks good, but I believe the animations play a bigger role in this specific type of game, they provide feedback and make the game feel more "alive" (icon wiggling or zooming in, etc).
    Also, make sure you run the animations on the icons when using the keyboard, and not just the mouse.
    Game is looking great, thank you for sharing your talent with us!

  • @Joern290
    @Joern290 Před 6 měsíci +1

    Looks amazing! Well done - you never disappoint ❤

  • @RTSFan1337
    @RTSFan1337 Před 6 měsíci

    I really like your UI Design approach - keep it up!

  • @CurtisDoesADig
    @CurtisDoesADig Před 6 měsíci +1

    Dude I REALLY like this UI design. This is so impressive for real!

  • @theintjengineer
    @theintjengineer Před 6 měsíci

    More impressed with the place you live 😮
    So much Nature around❤️

  • @Lizard_geek
    @Lizard_geek Před 6 měsíci

    I think I watched your LWJGL videos a long time ago and now you have a game released and even working on another? That is amazing man! Trying to get back into my hobby of game dev can be difficult but once you're in it your locked down and I love every second of it.
    You are doing great and living a lot of peoples' dreams!

  • @taylorbayouth998
    @taylorbayouth998 Před 6 měsíci

    LOVE the hand drawn look on icons and buttons!!!

  • @drtnt8855
    @drtnt8855 Před 6 měsíci +1

    As soon as I start work on UI and get stumped you upload. Great work Bro!

  • @clamor9849
    @clamor9849 Před 6 měsíci +1

    I’ve been playing skyrim and i think their potion mixing system is amazing and could be incorporated in your compost system. Basically so that when you first start the game, you do not know the effects of the fertilizers in the shop and you have to add them and wait for the compost to be ready and only then will you discover the effects of the fertilizers. That could give some progression to the compost system and also, could allow you to have a few sneaky fertilizers with negative buffs;)

  • @TuckerTheMandolinist
    @TuckerTheMandolinist Před 6 měsíci

    UI is one of my favourite parts of programming! Thank you for this video.

  • @VxMxPx
    @VxMxPx Před 6 měsíci

    Very nice. Gives different feel to the game. Big improvement. Happy you've corrected perspective on top-left clock icon, to be the same as coin.

  • @GamesBySaul
    @GamesBySaul Před 6 měsíci

    Nice work as always, I think the UI looks great, love the button style you've gone for and I especially like the transition button too!
    I think knowing where to draw a line under a task (at least for stage 1) is a good skill to have in development as you could keep doing the UI until its perfect...then you add the menu and realise you have to change it again!

  • @kylemason01
    @kylemason01 Před 6 měsíci

    Loving the UI design and layout! Great work dude!

  • @Spagheters
    @Spagheters Před 6 měsíci

    The new UI genuinely looks so amazing, I love it! For someone who struggles with designing UI you did a really good job!

  • @zarblitz
    @zarblitz Před 6 měsíci

    Implementing your UI controls as separate parts you can color through code is actually a big step towards accessibility because then you can allow the user to adjust the color scheme to fit their personal needs. Vision impairments are varied and personal. If they can adjust font size or the whole UI scale as well, that’s great too.

  • @souls.7033
    @souls.7033 Před 6 měsíci

    The most anticipated episode is here!!!! I haven't been this excited before!

  • @jkirby
    @jkirby Před 6 měsíci +4

    The UI looks great! As a software developer myself I also struggle with creating professional looking UI. I would be very happy with myself if I produced that UI!

  • @devsergio6308
    @devsergio6308 Před 6 měsíci

    The blue colors look great. My favorite is the darker blue palette

  • @Selentor
    @Selentor Před 6 měsíci

    I like how smooth/rounded the new UI looks. It fits well with the aesthetic of your vegetables.
    If you need inspiration for icons and stuff, it might also be helpful to look at how e.g. plants are sold/presented, the next time when you're buying something for your balcony.
    Keep up the good work. I'm looking forward to your next devlog.

  • @ElianeGameDev
    @ElianeGameDev Před 6 měsíci +2

    Your game already looks so professional.

  • @yssfv
    @yssfv Před 6 měsíci +1

    i compiled a list f really cool features that you may consider adding to the game here it is:
    *1.* Currently some players will think that making their farm good and look good is useless, so why not make a competition that happens from time to time
    and its a competition for the best farm, and the rewards may be: ingame coins, etc..
    *2.* Make guides for everything because if you're a new player you wouldn't know the mechanics without watching the devlogs
    *3.* And for the paths getting dirty mechanic make it so that for the dirt paths the thing you clean is fallen leaves instead of dirt
    because cleaning dirt from dirt paths is kinda stupid
    and a fun little idea! : make the harvesting sound effects of the game from your irl little garden, record sounds of you harvesting and add it to
    the game, if it sounds good of course

  • @igordasunddas3377
    @igordasunddas3377 Před 6 měsíci

    I love the ambient light around your set up. And the video is nice!
    Also: perhaps a radial menu around wherever the mouse pointer currently is and selecting a tool by moving the mouse into the radial sector of the tool would help the usability.

  • @burrdid
    @burrdid Před 6 měsíci

    I first watched you and bought Equilinox when I got out the hospital about 5-6 years ago. still very underated.

  • @ItsMeChillTyme
    @ItsMeChillTyme Před 6 měsíci

    That idea of trying to draw over/around a professional icon to give it more personality is really smart. Wow. Thank you.

  • @jmdeejay
    @jmdeejay Před 6 měsíci

    These curvy bits in the UI make me think that we're in the sky / clouds.

  • @zoksss5323
    @zoksss5323 Před 6 měsíci

    This game is really coming together. Great devlog

  • @NeilRoy
    @NeilRoy Před 6 měsíci

    Looks good. The "wavey bits" on the icons remind me of clouds, which fits in nice with the whole farm, outdoor theme. You could make the colour scheme selectable in preferences in the future as well, so people select which works best for them. Maybe even a colour blind mode.

  • @JezzGT
    @JezzGT Před 6 měsíci

    Looks really nice and fits the theme nicely!

  • @leleboske6881
    @leleboske6881 Před 5 měsíci

    looking insane. Must be hard to keep work so consistent for so long and after all that time seeing the end result. Very satisfying feeling i am wondering

  • @paul8731
    @paul8731 Před 6 měsíci

    Great video. I'd say you're doubting your own ability to make good UI - your concepts, ideas, styles and implementations are really awesome! Great work

  • @arctiformgames
    @arctiformgames Před 6 měsíci +1

    Ui is looking very nice, i like the hand drawn look. Perhaps, instead of trying to figure out the perfect ui color just make it a feature for players to switch the ui color when they want?

  • @Maetschll
    @Maetschll Před 6 měsíci

    Inspiring as always! Thanks 🙏

  • @eboatwright_
    @eboatwright_ Před 6 měsíci

    Looks amazing! I really like the big juuuuuuuicy outlines, and the fluffy UI shapes are really nice :D

  • @sour_trout
    @sour_trout Před 6 měsíci

    Having the ui be adjustable in code is so cool. I'll keep this approach in mind :)

  • @bluemond100
    @bluemond100 Před 6 měsíci

    The design is very well consistently stylized and overall cohesive with the rest of the game. It even matches the color palette pretty well. I do like the organic drawing but it may be overaccentuated in the plain buttons. Maybe it's too much shadow or something, but, if there were any weak points in the overall design, that'd probably be it

  • @blopstudio
    @blopstudio Před 6 měsíci +1

    ui look great imo u can be proud, crazy how you seem to be able to learn anything
    one thing id change would be making the outlines white rather than black, maybe it would fit better with the general color scheme of the game while still keeping the readability that an outline gives
    id try it at least
    also idk if you plan implementing a day night cycle in the game but if you do, the ui could change depending on the time
    all in all great work man love these videos always make me happy to watch

  • @ChristophLautlos
    @ChristophLautlos Před 6 měsíci

    Wow. the design is sooo good!

  • @clonkex
    @clonkex Před 6 měsíci +1

    Keep the cell shading in the icons IMO. It looks fantastic and gives the interface some charm. For some reason it reminds me of Dragon Quest 8, which is one of my favourite childhood games of all time, so maybe I'm biased.

  • @mikeysaurlol
    @mikeysaurlol Před 6 měsíci +3

    when you're plucking all the carrots the pop sound plays everytime and i feel like it might be fun to add a little randomness to the pitch to spice it up a little sometimes, like the animal crossing dialogue and stardew valley :)

    • @ThinMatrix
      @ThinMatrix  Před 6 měsíci +1

      The sound does actually already have randomized pitch, but I guess not random enough! I'll increase the variance a bit :)

  • @daviddelayat-dnapictures
    @daviddelayat-dnapictures Před 6 měsíci +2

    Nice !
    To speed up your photoshop process of outlining each icon, you might consider using the "outline" effect under "fx" right next to the "new layer" icon.

  • @Alchimistje
    @Alchimistje Před 6 měsíci

    You could put the number of items in the inventory in a little circle shaped darker backround. This is a quick visual queue where you can tell its a stack of items

  • @Skeffles
    @Skeffles Před 6 měsíci

    The UI looks great. I particularly like the render for each item.

  • @eric-id6bk
    @eric-id6bk Před 6 měsíci

    UI looks fantastic, perfect for this style of game

  • @Goodgis
    @Goodgis Před 6 měsíci

    I love the visual update. They seriously add to the character and charm of the game. Great work!

  • @isgoldsilver
    @isgoldsilver Před 6 měsíci

    this is beautiful work

  • @edhahaz
    @edhahaz Před 6 měsíci

    Great improvement on the UI!

  • @falcowinkler2429
    @falcowinkler2429 Před 6 měsíci

    looks lovely

  • @musemeghini
    @musemeghini Před 6 měsíci

    The UI is absolutely beautiful, congratulations

  • @MrLasditude
    @MrLasditude Před 6 měsíci

    Finally got around to playing Equilinox and loved it, which then raised two questions: "Is there more games from the same developer" and "Are there any videos about why and how the game was made?"
    Well, finding this video and this channel answers those questions quite thoroughly. I guess I have a lot of videos to pore through!
    The Game UI Database also looks fantastic and something I definitely make use in the future. Subscribed, excited to follow the progress!

  • @MrOmega-cz9yo
    @MrOmega-cz9yo Před 6 měsíci

    I like the UI. Suits the game nicely. I didn't know there is a game UI database. Thanks for the info!

  • @cleo8815
    @cleo8815 Před 5 měsíci

    If you are going to redraw over some icons, the brush tool for most art programs has a smoothing function that lets you freehand your lines without the jitter one would get from drawing with a mouse. You could give that a go. Wonderful video, amazing to see how the game is coming along!

  • @alexline4131
    @alexline4131 Před 6 měsíci +1

    UI is surprisingly hard. I've done it professionally a few times. I think you've done a brilliant job with it so far. I'm dyslexic, I like that font, it's not hard for me to read.

  • @SpikeStudio
    @SpikeStudio Před 6 měsíci +2

    UI is overlooked by many players, but spending the time to get it into a great state pays off. Overall great progress!

  • @graham42
    @graham42 Před 6 měsíci

    something I've always loved the idea of but never really seen implemented in a game (except for Hades, actually!!) is unlockable UI color schemes :)
    i think it could be really fun to unlock various color schemes through gameplay (maybe tied to an achievement system or some such) and thus allow the user to choose their own game look
    anyway, here's to another smashing devlog!!

  • @gavin.d.m
    @gavin.d.m Před 6 měsíci +4

    Brilliant.
    UI ATM seems to have gone clean and simple. You have done a great job with the overhaul so far.
    Regards the colour scheme, since you have programmed it, why not offer the option in the settings menu? Would that be a nightmare to code??

  • @gazthorp77
    @gazthorp77 Před 6 měsíci

    UI looks really good, clean, simple and fits the game perfectly

  • @bluebukkitdev8069
    @bluebukkitdev8069 Před 6 měsíci

    Text is 100% more readable if it has a contrasting update. If you want a light text, give it a thin dark outline; inverse also applies.

  • @Ladebalken
    @Ladebalken Před 6 měsíci +2

    Going to watch the whole video now

  • @diligencehumility6971
    @diligencehumility6971 Před 6 měsíci

    That UI looks really good! Gives the whole game a lift.

  • @marcruijs1039
    @marcruijs1039 Před 6 měsíci +1

    Man, every time you release a video I feel the urge to work on game development again. Your work is just so inspiring; it's polished, but doesn't feel overly complicated where you'd just have no idea where to start.
    I really should just focus on getting my degree though.. I mean, one day of programming couldn't hurt, right? Maybe 2?..

  • @HandleDeleted
    @HandleDeleted Před 6 měsíci

    Your irl garden inspired me to have my own garden! So far it's growing well! )

  • @bitnewt
    @bitnewt Před 6 měsíci

    I've worked on a bit of accessibility for web development and instantly thought, "what? That's plenty high contrast enough" as I usually just review my designs in monochrome to check the contrast for low vision or colour blind folks. Then I realised I've never considered how to make my designs accessible for people with dyslexia; I don't even have any idea how to check! It's nice to have a reminder to never stop learning.

  • @compasscrafting1147
    @compasscrafting1147 Před 6 měsíci

    Timestamp 5:50, the buttons you hand drew. I think I see why you're undecided. the shadow you've drawn loops around both sides and makes the eye not see it as a shadow anymore. I like the "informal button" look you went with, but that's what stood out to me. The wavy bits work really well: it moves those boxes and buttons away from the standard box design you mentioned yourself. I think the icons popping out of the hot bar lends itself nicely to your goal of an informal look. I think you've got a good start for a kind of style guide. Something very specific to Homegrown.

  • @jasonhaley2692
    @jasonhaley2692 Před 6 měsíci

    Hey great video! I think the brown color scheme is a lot more clean than the others, you can still see the buttons perfectly fine but there is a lot less jarring contrast.