Sorry your browser is not supported!

You are using an outdated browser that does not support modern web technologies, in order to use this site please update to a new browser.

Browsers supported include Chrome, FireFox, Safari, Opera, Internet Explorer 10+ or Microsoft Edge.

2D All the way! / 2d GUI Help/Request?

Author
Message
luskos
15
Years of Service
User Offline
Joined: 28th Jun 2007
Location:
Posted: 18th Jun 2010 15:51
Hi, guys i`m not sure it`s allowed to make request here about this but anyway.As many times i try to do this i fail.It`s not because i lack will to learn the brush, but i just can`t.The ordinary methods of learning somehow did not apply for me, it`s because i`m colorblind maybe.This is why is so hard for me.

Is there someone willing to help with this?

If there is someone who can help, what i need to provide you?Some concept or something?

Coding is My Kung Fu!
And My Kung Fu is better than Yours!
Phaelax
DBPro Master
19
Years of Service
User Offline
Joined: 16th Apr 2003
Location: Metropia
Posted: 18th Jun 2010 22:55
We can't all be artists, and I don't think anyone would have a problem with you asking for help with a GUI design. I've been in a GUI-design kind of mood over the past week, so if you give me a few details about what you want (type of game, controls, suggested menus) I'll see if I could draw something. I just got Photoshop CS4 yesterday (should've waited for CS5) and I need something to do with it now!


"Any sufficiently advanced technology is indistinguishable from magic" ~ Arthur C. Clarke
luskos
15
Years of Service
User Offline
Joined: 28th Jun 2007
Location:
Posted: 20th Jun 2010 01:58
I`m sorry for my late answer i hope you didn`t give up on this because of that.I just have mountains of work today.

I`m making RPG so i need windows, dialogs, bars, buttons, frames for skills and items.

I`m not sure where to start from so, because in the moment i`m working on inventory i think this is the best to be done first.You can make it like just a window with empty spaces for items.Other design wchich is most common is the inventory+gear/equiped items inventory in one window.I`m currently working with some dummy items for the inventory which are 64x64 but now they take too much space on the screen so maybe i`ll scale them in half.

You can experiment on buttons.For now you can make blank ones if you like until i list all options that will be supported.

I aim on minimap/radar and a window for the avatar + hp,exp,mana,level and name.

Quest window should be something simple, it will have mostly text in it.Dialog window with old paper/scroll effect is fine.

This is my first time to design menus with someone so you can tell me where i lack information before starting to do something.I`ll find some of my favorite rpg`s to see what they contain.

I start to feel already that i ask too much from you.It`s really unpleasent to ask for something like this.If you are unsure if something can fit my needs just experiment with it, it`s not like i`ll complain, actually i think i can adjust to your style eventually as long as it covers my needs.If you look at the structure of menus from some famous game like WoW or something, and follow it, mostly you can be sure you are doing great.

Basic concept can be wood, steel and nature.

I can allready say good job Phaelax, because for now you made more than most people.You decide to help with this!

If you have troubles with this or the idea is not that atractive when you think twice you can tell me, i won`t offend.

Coding is My Kung Fu!
And My Kung Fu is better than Yours!
Phaelax
DBPro Master
19
Years of Service
User Offline
Joined: 16th Apr 2003
Location: Metropia
Posted: 20th Jun 2010 05:24
Ok I'll see what I can come up with. What's the genre for this rpg? Fantasy, sci-fi, cartoons? That'll give me an idea on style.


"Any sufficiently advanced technology is indistinguishable from magic" ~ Arthur C. Clarke
luskos
15
Years of Service
User Offline
Joined: 28th Jun 2007
Location:
Posted: 20th Jun 2010 18:51
It`s gonna be fantasy one.

Coding is My Kung Fu!
And My Kung Fu is better than Yours!
Phaelax
DBPro Master
19
Years of Service
User Offline
Joined: 16th Apr 2003
Location: Metropia
Posted: 22nd Jun 2010 00:27
Thought I'd share what I have so far. This should at least give a general idea of how things are coming along. Some of the elements in the interface don't exactly blend well together yet. Let me know if you like the grunge-look of the scroll and stuff or if you want something cleaner-looking. The background is a screenshot of WoW I found online.


"Any sufficiently advanced technology is indistinguishable from magic" ~ Arthur C. Clarke

Attachments

Login to view attachments
luskos
15
Years of Service
User Offline
Joined: 28th Jun 2007
Location:
Posted: 22nd Jun 2010 14:20
Good job on this.However it looks more like GUI for RTS now.I attach picture to see how i imagine the avatar minimap and skills.I use WoW for refference too.I like the buttons and healt, mana bars.The scroll without the grid can be used for something else.The minimap window is very good i wonder if you can do few different sizes one fullscreen for sure.

Coding is My Kung Fu!
And My Kung Fu is better than Yours!

Attachments

Login to view attachments
Phaelax
DBPro Master
19
Years of Service
User Offline
Joined: 16th Apr 2003
Location: Metropia
Posted: 23rd Jun 2010 03:43
I've drawn more RTS interfaces than anything else, I guess my mind just subconsciously stuck with the design.

I've also grabbed a few screenshots from various RPGs to hopefully pick up on a few design aspects.


"Any sufficiently advanced technology is indistinguishable from magic" ~ Arthur C. Clarke
Phaelax
DBPro Master
19
Years of Service
User Offline
Joined: 16th Apr 2003
Location: Metropia
Posted: 25th Jun 2010 04:33 Edited at: 25th Jun 2010 04:45
Here's a new version. Interface is half the height as before. It's got a bit more of that "diablo" feel to it, not sure how you like that. Still drawing the experience bar which will go along the top of the interface. The arrows are to cycle through multipe icons or spells or whatever.



This is a screen for displaying whatever fullscreen stuff you need. Tell a story, view objectives, equipped your character (other placement graphics needed obviously)
http://img.photobucket.com/albums/v204/phaelax/story.jpg

I found a really cool interface on Deviant Art, maybe the designer would let you use it?
http://lordbaltz.deviantart.com/art/Masters-of-Belial-Interface-106663986?q=1&qo=1


"Any sufficiently advanced technology is indistinguishable from magic" ~ Arthur C. Clarke
Devonps
13
Years of Service
User Offline
Joined: 5th Nov 2009
Location: Nottingham
Posted: 25th Jun 2010 11:17 Edited at: 25th Jun 2010 13:47
Phaelax - I really like your work, not being an artist myself, can you give me some tips on approaching how to design a GUI for my roguelike?

Thanks in advance,

Steve.

[edited: because my original post was too vague!]

Marriage is a circle of rings....
Engagement ring, Wedding ring, Suffering!
luskos
15
Years of Service
User Offline
Joined: 28th Jun 2007
Location:
Posted: 25th Jun 2010 12:27
Ah very nice redrawed and the fullscreen story image is just fantastic.I`ll try to contact this guy from deviant art if he can share some of his work.Very good work Phaelax.

Coding is My Kung Fu!
And My Kung Fu is better than Yours!
luskos
15
Years of Service
User Offline
Joined: 28th Jun 2007
Location:
Posted: 2nd Jul 2010 00:07
Hi i wanted to know how it`s going.I hope there is something done to work with.Excuse me for double post, the thread begin to die so i wanted to know if you give up on this.I know you probably have your own projects and on top of that you have a life to live

Coding is My Kung Fu!
And My Kung Fu is better than Yours!
Phaelax
DBPro Master
19
Years of Service
User Offline
Joined: 16th Apr 2003
Location: Metropia
Posted: 7th Jul 2010 20:04 Edited at: 20th Jul 2010 01:15
oh yea, suppose i should give you the raw image files.

I'll get them to you this week, hopefully before I skip town for my reunion.


"Any sufficiently advanced technology is indistinguishable from magic" ~ Arthur C. Clarke

Attachments

Login to view attachments
Phaelax
DBPro Master
19
Years of Service
User Offline
Joined: 16th Apr 2003
Location: Metropia
Posted: 16th Jul 2010 00:03 Edited at: 16th Jul 2010 00:05
sorry this took so long, but here are the graphics so far. Everything is PNG format so the subtle drop-shadows show up nicely. What the picture doesn't show (which I forgot about) are vines around the top of the interface. I was thinking they could grow across the top to indicate experience per level or something.

@ Devonps,
Just read up on various tutorials for photoshop or gimp or whatever you wish to use and think up an idea. Sketch it out roughly by hand first if you need to. Find some textures and start piecing things together. Keep in mind its for a game, so some elements of the interface should be kept as separate images so you can layer them in the game.


"Any sufficiently advanced technology is indistinguishable from magic" ~ Arthur C. Clarke

Attachments

Login to view attachments
LBFN
15
Years of Service
User Offline
Joined: 7th Apr 2007
Location: USA
Posted: 17th Jul 2010 17:07
very, very cool Phaelax. Very nice work. I think having some natural talent has something to do with it.

So many games to code.......so little time.
Phaelax
DBPro Master
19
Years of Service
User Offline
Joined: 16th Apr 2003
Location: Metropia
Posted: 20th Jul 2010 01:15 Edited at: 20th Jul 2010 01:16
I've attached an executable with source code and the images, showing an example of the interface in action. I've also added a cursor graphic.

left/right arrows = inc/dec health bar
up/down arrows = inc/dec mana bar
+/- = inc/dec experience bar
tab = toggle objective screen

There's also tooltips if you hover over the health, mana, exp bars.

Here's a screenshot of the interface being implemented into DBP: screenshot


"Any sufficiently advanced technology is indistinguishable from magic" ~ Arthur C. Clarke

Attachments

Login to view attachments
luskos
15
Years of Service
User Offline
Joined: 28th Jun 2007
Location:
Posted: 21st Jul 2010 22:12
Thank you for everything Phaelax.Once i get free time i`m back on my project.You go over my expectations with the implementation of the interface, probably because you manly do coding.Thank you again!

Coding is My Kung Fu!
And My Kung Fu is better than Yours!

Login to post a reply

Server time is: 2022-12-01 19:20:34
Your offset time is: 2022-12-01 19:20:34