Author Options:

New Home Page Mockup! Answered

Everyone is complaining about how inconvenient the latest home page is, and I agree. See here. So I put together a quick mockup of a home page concept. Please take a look and tell me what you think. What parts do you like, and which parts need work? Feedback is greatly appreciated, especially from the admins. However, "This sucks because I don't like it" is not an acceptable comment. I prefer "This part sucks, do this to fix it."

I've posted my original version and a version with notes.
Full Resolution Images Can Be Found Here.

(or click the [ i ] box icon at the upper left of each picture.)


That's a fine start. I like the side notes on the high res images.


Its the click on the i trick

Oh, that - I think OP meant the high res were at his blog, but that link is now deleted...

By the way, I think the current page is now more usable and I like it more than when this topic was posted. It could still fit some more instructables in though.

Why are people always compelled to change up something that is working? If your gonna spring these new cover-pages on us at least give us the option of which type of cover-page we want to view (ex. make multiple design concepts available at all times and the user picks the one that best suits them) Then we can change at our convenience like one does with their Desktops background and/or like the Firefox customization feature.

All layout concepts are welcome if you would like to submit one. If enough good ideas come together, they're bound to influence future staff choices. (By the way, I don't work for instructables. I just want to find a layout that the majority will agree upon.)

I appreciate the offer, but I believe you missed my whole point. I'm sure the Instructables site has used many different layouts for their home page in the past. Rather than scrapping all those different designs allow users who sign up too Instructables to choose which ever layout they prefer. You can put the different options in the "Settings/Customize" section. In that manner you can please more people at one time as they'll be able to stay whith the current or switch to an alternative at their leisure. Maybe even have a section under settings where people can upload a page layout.

Hmmmm, speaking as a fan, an original orange background might look nicer but wouldn't that clash against some of the pictures on the 'ibles? I think an off white or yellow might look slightly better.

Also, I don't know much about programming, admittedly, but wouldn't switching out to completely different layouts take a little longer to load? Or would this be simply a color change?

Realistically, the different layout options could simply be different websites. E.g. instructables.com, instructables.com/home2, instructables.com/home3 etc. If you were still signed in and had chosen a different home, the site would automatically redirect you to the one that you had determined. It would take some extra development and update effort on the staff end.

A simpler way might be to use different stylesheets based on a user's choice. :) Of course, users can make their own styles for the site right now with userstyles.

Is there a regular instructabler that's good at web development? The actual coding is out of my league at the moment.

I'm okay at it. (I've made userstyles for the site before, but haven't really felt like going to the trouble of updating them to work on the new style of ibles, haha.) Implementing the actual "choose your style" thing would be harder than making the styles (although that is certainly not trivial).

Switching to another layout would take more time *if* you loaded the default every time no matter what, whether you then had the user manually override or had them set a preference and always switched for them. (How much time is pretty hard to predict without any kind of idea what all this would entail - it could take significantly longer or a very short time.)

If instead (for a logged-in user) you checked their preference and loaded only the stylesheet(s) they wanted *without* calling up the orange default ones first, then it would be a simple color change. And of course for non-logged in users it's orange all the way (or whatever the default is)!

(Of course, to make a comparison between these two scenarios, you'd have to factor in the time it would take to check which style the users preferred as opposed to simply using one, but unless something is terribly wrong the time that takes ought to be pretty much negligible for the end-user)

Thats a great idea, too bad HQ probably wouldn't let you have it, I keep asking for "eyebleed orange" back, but RobotManagementHQ  some ibles representative tells me to piss off (I'm paraphrasing) and deletes some of my comments.
Also, JamesRPatrick can't do anything about it, just like you or I.


7 years ago

To everyone on this thread, just want to apologize for my earlier comment. I read this through and email and was the first time I saw any criticism of the homepage, so I read this as an alternative as to what the homepage could've been like, and accidentally read this as humorous. I've since redacted that comment from the board.

Also, if you're wondering why I'm posting this again, it's because I have no backbone. If it makes anyone feel any better, this thread was actually discussed at the office and it did generate some discussion.

Aaaaaand you cheapen it with a southpark screenshot. Way to go genius.

For the love of Pete please, Just. Let it. Go.

Have you actually written the source, or just arranged some pictures?


No source yet. I think a layout should be approved before any energy is spent on that.

I disagree, I think you should start working with source first.
The site isn't going to use your stuff because they have different opinions and pay people to do that. As an exercise in doing something, putting a real page together that works has value in it's self.


Hi lemonie. While I agree that there is not a snowball's chance in hell of the design being adopted (not because it's a bad design), making a graphical mockup which is then coded is pretty standard web design practice. Sometimes the dude who mocks up the pages also codes, but a lot of the time (and especially when you get to the pro level) different people do the coding and the mockup, with the mockup being done first. Frankly, this just makes sense - how can you write the code if you don't know what you want it to do?

We know what it's wanted to do - the layout bits are done already.
Perhaps people should be uploading alternative layouts here?


But...that's what he's doing...putting an alternate layout up...

Yes I think we'd appreciate more alternate layouts? (I don't use the front-end so I can't)



7 years ago

You're right, comment redacted.

You know that sucking-through-the-teeth noise that mechanics make when a job is going to get expensive?

I just made that noise when I read your comment.

I'm not saying this layout is bad, even though reading it now it sounds like it, just that I don't think it does a better job at showcasing the homepage than the current one.

HOWEVER, looking at it again I think this would actually make for a great Web Application or Mobile Viewing of the homepage. It's simple and the white text boxes might make it stand out more on an iPhone.

I suggest you prostrate yourself in front of the Keeper Of the Be Nice Policy - and see if you can pick up the odd tip or two......

I quote Lira, who quotes the sainted KOTBNP

I quote our Community Manager:

"No one is above The Be Nice Policy, no matter how entitled they feel."

This is someone's, actually a CUSTOMER's idea to help make things better, you may not like it, it may look, as we say, like a dog's breakfast to you, but its a genuine effort to create some debate.


Ok you're right. Didn't mean to get all sarcastic and I apologize. Bottom line though, I just think this suggestion is a little too cluttered and the white text boxes don't do a good job presenting the instructables page. I also personally have no problem with the current homepage.

I quote our Community Manager:

"No one is above The Be Nice Policy, no matter how entitled they feel."

At least this CAN be navigated on a phone. It has text you can see without hovering on.

Oh and what happened to the be nice policy? I didn't realise it didn't apply every Thursday.

I find that... crowded, myself. I'd have smaller thumbnails with space between.

However, I do like the side-scroll buttons for going back through a channel, and the idea of putting a (regularly changing?) classic project on the front page.

I agree that it is crowded, but am conflicted because I also dislike very small thumbnails. I've noticed that with the advent of smaller thumbnails and only a title (or not even that much!), I click on FAR fewer projects - the lack of a description makes everything blend together.

(Disappearing post bug)

At the scale James has done, he's only got three images across the screen.

On a PC, netbook or iPad, five or six would fit comfortably, with clear text.

At the proper scale, the width should span an entire 4:3 screen. On a widescreen monitor, it should have an inch or two on either side(not sure how I can show it full scale here.). I do think the page could fit some more category pictures(did they do this already?). The goal is to get a page with the most efficient use of the space, while inviting visitors to explore all of the links. I think that most of the picture formats on the site should be bigger.

By the way thanks for the feedback!