UI and Graphic Design
polycounter lvl 12
Hey Guys,
Just making this topic to see if there are people in this community that are into these two things.
I have always wanted to get into UI design and Graphic design in general making your own logos/text types and Game Icons i was wondering if there are any good Blogs, Sites and Books I could read or Browse that focus on these two things, even communities like polycount that are out there.
Thanks again,
Arman
Just making this topic to see if there are people in this community that are into these two things.
I have always wanted to get into UI design and Graphic design in general making your own logos/text types and Game Icons i was wondering if there are any good Blogs, Sites and Books I could read or Browse that focus on these two things, even communities like polycount that are out there.
Thanks again,
Arman
Replies
www.faveup.com
www.greyscalegorilla.com - technically motion design rather than straight graphics but still a fun blog and some awesome podcasts too.
[ame="http://www.amazon.com/Basics-Design-Layout-Gavin-Ambrose/dp/2940373345/ref=pd_sim_b_5"]Amazon.com: Basics Design: Layout (9782940373345): Gavin Ambrose, Paul Harris: Books[/ame]
[ame="http://www.amazon.com/Typography-Basics-Design-Gavin-Ambrose/dp/2940373353/ref=sr_1_1?s=books&ie=UTF8&qid=1327178087&sr=1-1"]Amazon.com: Typography (Basics Design) (9782940373352): Gavin Ambrose, Paul Harris: Books[/ame]
Some video game UI/icon related ref:
http://lucas.hardi.org/designing-the-warhammer-online-ui/
http://mattciaglia.com/r3.html
http://www.ludodoesjudo.com/
http://www.jamiemartindesign.co.uk/Graphical_User_Interface.html
got some good places to start for picking out colors and patterns. I always go back to this when I am looking for something eye catching
I'm not too sure what the visual design to code design ratio will be, but I'm signed up for it either way.
archive of flash sites- tons of motion graphics and UI eye candy
So 2-3 links in here are super precious. Thanks for bringing that topic up, ae.
Still can't believe there's so few focussed portfolios on game's UI stuff out there, though
Yeah I know what you mean, I've got a friend who's a graphic design who wanted to know more about UI for games. So I helped by trying to find examples for him, needless to say I didn't find that many.
Here's a few more game UI/icon related ref that I found:
http://vinceshayer.carbonmade.com/
http://www.renascent.nl/ (some Killzone stuff)
http://www.behance.net/gallery/Forza-Motorsport-3/658283
http://www.behance.net/gallery/Forza-Motorsport-4/2704011
http://www.gabrielmourelle.com.ar/web/home.html
http://hayleybrant.co.uk/projects/
http://www.behance.net/gallery/Ultimate-Marvel-Vs-Capcom-3a/2307788
http://www.behance.net/gallery/Deus-Ex-Human-Revolution-User-Interface/2465641
As far as HUD/UI design goes, I'd actually suggest looking at the following:
Symbol - [ame="http://www.amazon.co.uk/Symbol-Angus-Hyland/dp/1856697274"]Symbol: Amazon.co.uk: Angus Hyland, Steven Bateman: 9781856697279: Books[/ame]
Los Logos - [ame="http://www.amazon.co.uk/Los-Logos-v-R-Klanten/dp/3899552229/ref=sr_1_3?s=books&ie=UTF8&qid=1327279692&sr=1-3"]Los Logos: v. 4: Amazon.co.uk: R. Klanten, Hendrick Hellige: 9783899552225: Books[/ame]
Dos Logos - [ame="http://www.amazon.co.uk/Dos-Logos-R-Klanten/dp/3899552660/ref=sr_1_5?s=books&ie=UTF8&qid=1327279692&sr=1-5"]Dos Logos: Amazon.co.uk: R. Klanten, N. Bourquin: 9783899552669: Books[/ame]
Tres Logos - [ame="http://www.amazon.co.uk/Tres-Logos-R-Klanten/dp/3899551583/ref=sr_1_4?s=books&ie=UTF8&qid=1327279692&sr=1-4"]Tres Logos: Amazon.co.uk: R. Klanten, N. Bourguin: 9783899551587: Books[/ame]
They come fairly cheap, they're a huge source of inspiration and are perfect books for your coffee table / desk. I have them all on my desk at work and often look through them on a daily basis
When it comes to game-specific Graphic Design / UI, there isn't really much documentation. This is something I aim to rectify (tutorials/notes/tips) since it's quite a niche area and there's a lot of demand for the role.
If you have any specific questions then let me know
Behance network (CGHub for designers)
http://www.colinpost.com/
Some of my bookmarks you can get inspired:
- http://www.delicious.com/megalmn2000/motion%20design
- http://www.delicious.com/megalmn2000/graphic_design
- http://www.delicious.com/megalmn2000/motion_design
- http://www.delicious.com/megalmn2000/web_design
Brand New
Books:
All of Tufte's stuff
Understanding Comics
Yeah there seems to be a lack of documentation regarding game specific Graphic design, iv always wanted to make my own UI's for games that i play basic mods really.
Do you have any good start off points whats the best way to get started? what programs would i need to make a decent layout/designs/ui?
Illustrator is widely use for vector graphics (scalable graphics).
InDesign for page layout.
Flash for making interactive menus / ui.
The best way to get started is simply to give yourself some sort of brief to work to. When I was a student I used to make mockups for how I would redesign interfaces from my favourite games. By doing so, you'll gain an understanding of layouts. From there, you can play with colours and styles in order to make something entirely different. The most common issue I see in the portfolios of those looking to become a Graphic Designer in games is that they just put text on a background image and call it an interface. There's much more to it than that. Even down to things such as optimization of vector graphics in UI.
If you can't think of any briefs then you could sign up at: www.99designs.com and enter some competitions for fun or simply work to some briefs in your own time. They are live briefs and they cover all sorts of areas. They're a good challenge when you're running out of ideas.
Thanks for the writeup man! really got me pumped to dive into UI creation feet first. I think taking your favorite game and redesigning the UI for it is a good point for me to start and grabbing the programs you listed and figuring them out.
Thanks again!
When you start looking at 2D game art there is actually a lot of content involved in the creation of menus / UI. Try and list all the elements you can see on a page splitting them into categories like this:
-Headings / Titles
-Content / menu items
-Icons
-Images
-Controller Buttons/hint text
-Backgrounds
etc.
Looking at menus you'll come across something that would fall into one of these. Once you know what elements are common, you can go about designing an initial layout for any given page and dedicate space for the worst case scenario (we always look at the longest translations with all button hints displayed at once).
With regard to HUD it will depend on the type of game, but will include some basic elements which again can be categorised in a similar fashion. For example, a FPS game:
-Ammo counter
-Minimap
-Objective icons
-interaction prompts
-subtitles / hints
etc.
I could go into more detail but I think the wiki would be a more beneficial place for that.
Pick up the demo of Hype for mac if you can- its actually very good- a design-focused editor with html5 tools (it has a timeline like flash)