How can I design a good UI for my VN?!
A downloadable guide
hi, i wrote an 11 page pdf about designing visual novel user interfaces!
it's intended for developers working with ren'py, but it can easily apply to other engines as well (and even other game genres!)
the contents are mostly about fonts and textboxes, but i'd like to add more in the future, as long as it relates to UI (i didn't talk about the game menu at all...) so feel free to leave suggestions if that interests you!
RESOURCES LINKED IN PDF:
- Calligraphr (custom font maker) - https://www.calligraphr.com/en/
- Caption Tool for Ren’Py (by npckc) - https://npckc.itch.io/caption-tool-for-renpy
- Dyslexia Font and Style Guide - https://www.dyslexia-reading-well.com/dyslexia-font.html
- Lemma Soft Forums (for help with Ren’Py!) - https://lemmasoft.renai.us/forums/
- Making Games Better for the Deaf and Hard of Hearing Designing for Disability (by Game Maker’s Toolkit) - https://www.youtube.com/watch?v=4NGe4dzlukc
- Ren’Py Accessibility Add-On (by minute) - https://minute.itch.io/renpy-accessibility
- Ren’Py Documentation (ESSENTIAL coding resource) - https://www.renpy.org/doc/html/index.html
- Visual Novel Interfaces tumblr (for design inspiration!) - https://visual-novel-interfaces.tumblr.com/
Download
Comments
Log in with itch.io to leave a comment.
Ty sm nami, I'm planning on making a game for my sisters birthday, this stuff will help immensely. ^^
You achieved impressive feats, congrats, I'm just a random person trying to make visual novels
hello, everyone i want to make a rpg/ novel game for the latest game jam but i dont know where to start can anyone help
You followed me?
some advices are always useful, for any project, please consider reading at least titles of this PDF (10 pages) to be conscious of the importance of caring/thinking of your readers (color contrast, size of the text, accessibility...)
thank you Nomnom Nami!
Ok so I got it done but I cant put it on Itch.io. Can you help me with that? What I mean is that I made a visual novel but I cant upload it on itch.io
Just asking, how did you try to upload it? I haven't messed much with Ren'py but I haven't had issues uploading games/builds.
I hit build first then upload to itch.io. But i got it working
Thanks a lot!
I'm very late on this but thank you so much for this guide! It's great having the option to turn on font for the dyslexic and I probably would've never found the other resources on my own.
Nice! I learned a lot from this so if I want to make a visual novel I will know what to do with the UIs! I love all you made Nami! Besides, I'm rating this a 5/5!
noice
gonna check it later
yeah great job thanks for sharing :)
That's awesome and nice of you, thank you!
Thanks a bunch !
Definitely good stuff here, for any UI, not just a VN.
This is soooo awesome and wonderful and amazing. Thank you
Thank you for this! Not that you have to do all of these if you don't want, but I'd definitely be interested in seeing more about:
Maybe something like scrollbars and sliders, too? There are a lot of different things you can do with those.
thanks for the suggestions! i definitely have some thoughts on all of those things i'd be glad to share when i have the time hehe
Thank you!
I just joined to the nanoreno and I've allways had problems with a good GUI Nami you're an ANGEEEEEEEL
a thing about calligraphr: it's very good but! dont bother doing their stupid paid service to get enough letters! you can download a handy dandy thing called fontforge that lets you combine any two fonts together so.. just make one font with your letters and numbers, and make a second for any special characters you need!
Thank you so much, very useful! I was about to learn about GUI!
Calligraphr is a godsend; i've already sent it to my comic-making friends and my youtuber friends who need fonts for thumbnails :100emoji:
Thank you for this guide and the linked resources! They definitely helped confirm some decisions I've been considering for my own GUI :)
Oohh this is super helpful!! (And just in time as I'm trying to design my own GUI... uwa....) Thank you for sharing your wisdom!!!
Aaaah, thank you!