Hack Forums
Fourth Website Design -= Otakume =- [Flat, Responsive] - Printable Version

+- Hack Forums (https://hackforums.net)
+-- Forum: Tech (https://hackforums.net/forumdisplay.php?fid=444)
+--- Forum: Graphics (https://hackforums.net/forumdisplay.php?fid=156)
+---- Forum: Rate My Graphic (https://hackforums.net/forumdisplay.php?fid=133)
+---- Thread: Fourth Website Design -= Otakume =- [Flat, Responsive] (/showthread.php?tid=3705556)

Pages: Pages 1 2


Fourth Website Design -= Otakume =- [Flat, Responsive] - Tasemu - Aug 20, 2013

Hey hey people. Back again with another website design I have been tinkering with. This time I wanted to try and make something following the flat user interface design that seems to be so popular nowadays. It ended up being a lot harder than I imagined due to the limitation in effects I was able to use while maintaining the style. I opted to pay particular attention to my colour scheme and spacing while making this. I relied mostly on colour, iconography and nice typography to create a design that was simple, easy to navigate and easy on the eyes.

Live preview below as always. Much love.

LIVE PREVIEW


* - Ienaos - Aug 20, 2013

Wow, looks nice Tasemu. Good job! 🙂


* - arimaru - Aug 20, 2013

Very nice, I really like the UI, Nothing to flashy just a nice simple look


* - KinGxKeV - Aug 20, 2013

Very good work Tas. You always amaze me with everything.


* - oneechan - Aug 20, 2013

Kinda dislike the tiny bit of space under the flag of each post. Also think that top bar could stay stationary, but otherwise, it looks great. Nice and simple.


* - Hentai - Aug 20, 2013

Hm from what I can see it looks very nice tas. 9.5/10


* - barrier - Aug 20, 2013

Looks nice but a little bit to crowded with stuff but besides that it looks really nice


* - Homesick - Aug 20, 2013

Looks quite nice :) keep up the good webdesign !


* - Aired - Aug 20, 2013

You have spacing and typography issues throughout the whole design.
- Everything feels way too cramped together.
- Should differentiate between your heading slab font and your san serif font, because right now it just looks like you splashed those two fonts into random places.
- Couple of validation errors as well.
- The state your website is in right now, it really shouldn't even be considered responsive right now. I suggest you consider fixing them.

Overall, good attempt indeed. It's very nice to see designers in HF are converting to flat designs. Good luck man.


* - Members only - Aug 20, 2013

Wow this looks sick! I say a 9/10 on this one


* - Tasemu - Aug 21, 2013

(Aug 20, 2013 08:42 PM)TheSire Wrote:  You have spacing and typography issues throughout the whole design.
- Everything feels way too cramped together.
- Should differentiate between your heading slab font and your san serif font, because right now it just looks like you splashed those two fonts into random places.
- Couple of validation errors as well.
- The state your website is in right now, it really shouldn't even be considered responsive right now. I suggest you consider fixing them.

Overall, good attempt indeed. It's very nice to see designers in HF are converting to flat designs. Good luck man.

Aye ill fix those up. I need to mess with the mobile version a fair bit to get something more practical. I will look over my typographic choices and try to part them more.

Ill also work on my spacing. I cramped a lot together because a lot of the sites i had a look at followed that theme. ^^

Thanks for your feedback, I will make sure to use it.


* - Emoticon - Aug 21, 2013

Link 3 and 4 are a bit derpy on mobile. They get pushed to the next line, and that kinda ruins the look you were going for.


* - Tasemu - Aug 21, 2013

I'll switch it out for a mobile dropdown button. ^^


* - Grey Goose - Aug 23, 2013

I like it! Keep up the good work! - Did you code it by your self?


* - xhflhkeuhwguu34 - Aug 23, 2013

A lot of people have given you some really nice feedback, so let me jump in here and add my own.

The navbar looks nice, however the color is a little milky. A tad darker would be nice.

The edit profile link should be larger or be a button. Do you even need it, considering there's already a cog in the navbar?

Consider using the title="" attribute in HTML to define what your icons do. This way, I can see what the lightbulb does when I hover over it.

I'll add more soon.