Site layout (mock-ups only)

moving

New Member
(Going to copy over what I posted elsewhere as the thread intention is the same)

Sorry for the length of this post! And really sorry if the images are too large.

Hey everyone. I've recently joined the community to hopefully improve my skills and gain more knowledge into design. Basically, with this post I'd like to get as much advice, suggestions and opinions (and critique I suppose?) as I can. This is my first attempt at creating a layout for a site so I'm still getting to grips with what looks good and what does not. Just as a side note: I won't be coding and scripting this, it's a bit of collaborative work between me and a webmaster of another site I help run.


So, about the site. Simply put, it's going to be a gaming news site (yes, we know there are plenty but we're going to make this a start-up then expand if it's successful, using the success of the first site that's already going), with all the usual features but a few other little things we're hoping to include, I've been asked to keep those hush-hush for now though. Layout-wise I've been trying to go for something fairly striking but familiar to readers. I'll put images below with a brief summary of what's going on in each one. I'd like to mention that the latest ones are still largely unfinished, but once I hopefully receive some tips and advice I can get to finishing the layout of the main page and then the pages that follow. Also, these are simply mock-ups, there's not a working version of anything yet. I understand it's hard to determine functionality from still images but hopefully I can get more advice/critique on that when there's a working coded version. Also, we're intending to go for a responsive layout.

_________

Here goes...
Images #1 - #4 I've included to show the development process, we've moved away from using those for the simple
fact we don't don't like them. That doesn't mean we won't or can't draw more elements from them if you think they're stronger.

#1
Basically, this was the first layout created, with a few follow-ons to the right (the slanted thing was never going to happen, merely trying something a little abnormal). Follows a generic news delivery site format. The large area at the top was intended as an area to display feature news as well as latest submissions from users. The rest should be self explanatory. The grey rectangles are the logo and information I've withdrawn for now. The logo however is fully complete, just not wanting to show due to it revealing information not ready to be shown.

IMAGE

_________
#2
Next up is a more image-based attempt. Far from finished, yet maintaining the 'featured news' area.
_________

#3 A refinement of #2. The featured area is scrapped in favour of tiles. Not a huge amount to say here.

IMAGE
_________

#4 This is hopefully our final layout (after suggestions and improvements). Again, the black rectangle is the position of the logo. The entire image at the top is a single featured area. Which displays the latest article relating to it, along with a preview of the games 'Hub' (a congregation of all things related to the game). Tried to maintain a tile look.

8659207115_9c3d149241_c.jpg

_________

#5 This is the same as #4 but with the addition of side bar items on the right, these are things we REALLY want to include on the main page but I feel that they make it all a bit cluttered, so any suggestions there are a bonus. They're hopefully going to contain information on a large part of the site.

IMAGE




Hopefully that's all good. I tried actually embedding the images in the post but they weren't showing in the preview for some reason, so assumed they weren't going to work. I am open to critique on all aspects, like I said this is my first time doing this so the more advice I get the better. If you require larger images or any more details I'll happily provide them. I'll also update later with a small addition I've added relating to navigation, which isn't including in #4 & #5.

Thanks!
 
Hi, welcome to the forum.

I really like it. Very stylish and a massive improvement on a lot of gaming sites I've certainly seen. First, nice choice of font - is that Gotham? One of my favorites. Like the choice of colours too. They add an extra sleekness to the finished look.

Great layout. Responsive is definitely the way to go. It makes the site a lot more accessible to viewers on other devices and who are on the move. I also can't think of many other gaming sites that use a responsive format either. Correct me if I'm wrong.

I think I prefer it without the sidebar - jpg 4. I find the big white boxes in the sidebar make it look a bit messy. I'm sure you can find a way of cleaning that up.

Job well done so far. Look forward to seeing the finished thing.
 
Hi, welcome to the forum.

I really like it. Very stylish and a massive improvement on a lot of gaming sites I've certainly seen. First, nice choice of font - is that Gotham? One of my favorites. Like the choice of colours too. They add an extra sleekness to the finished look.

Great layout. Responsive is definitely the way to go. It makes the site a lot more accessible to viewers on other devices and who are on the move. I also can't think of many other gaming sites that use a responsive format either. Correct me if I'm wrong.

I think I prefer it without the sidebar - jpg 4. I find the big white boxes in the sidebar make it look a bit messy. I'm sure you can find a way of cleaning that up.

Job well done so far. Look forward to seeing the finished thing.

Thank you! I wasn't expecting such a positive first reply, if honest.

The font choice has changed a couple of times but eventually settled on Montserrat, Gotham was in an older one I believe. Colours draw from the logo so I'm glad they work, means I have to worry a little less about changing those. Read some comments recently about how blues seemed a bit out of the box.

Thanks again. It was either got for responsive or have apps for different platforms, but responsive is definitely the best way it doesn't just account for mobile devices that way. I think there are a couple but most others just direct to a barebones mobile site, if that.

I much prefer without the sidebars too, I don't suppose you'd have any suggestions/input on implementing those a bit better? I'm not sure if having white text on black would work there for those.
 
Cool designs - Nice use of the graphics.
I like the number 5 layout although the middle section looks a bit like a pop up advert rather than something connected to the page - At least thats how I viewed it initially. Probably because of the lack of space and the bright colours which you typically get with adverts. Maybe there would be a way to introduce some space between the sections without detracting from the style.

I also can't think of many other gaming sites that use a responsive format either. Correct me if I'm wrong.
This was the main one that springs to mind: Polygon
I'm not exactly a massive gamer but I do remember that site.
 
How did you get on with this in the end? Interested to see the live site!

I wish I had the live site to show... It's actually still all going ahead, I've changed a few things (the logo ended up changing a fair amount, which eventually meant I changed the layout. Still can't show the logo sadly). Will embed the two newest mock-ups below. All being well this will be live soon, not sure if it'll look exactly like this though.

The plan is to launch it as a sort-of-beta, then I will continue going over the design of things.


Cool designs - Nice use of the graphics.
I like the number 5 layout although the middle section looks a bit like a pop up advert rather than something connected to the page - At least thats how I viewed it initially. Probably because of the lack of space and the bright colours which you typically get with adverts. Maybe there would be a way to introduce some space between the sections without detracting from the style.


This was the main one that springs to mind: Polygon
I'm not exactly a massive gamer but I do remember that site.

Polygon is pretty nicely designed, sometimes I feel it's a little cluttered though. I've changed from that middle section you mentioned, we thought it best to stick to images with the same aspect ratio so it's easy when posting news. Changes are below!

_____

Latest mock-ups are HERE and HERE. Any feedback you guys could give would be great. I'm really open to it all, still trying to get to grips with web design. Thanks! :)
 
Back
Top