Click to expand

Design better navigation for FJ and get colored...

  • Recommend tagsx
Views: 27296
Favorited: 6
Submitted: 03/31/2014
Share On Facebook
Add to favorites Subscribe to admin submit to reddit


What do you think? Give us your opinion. Anonymous comments allowed.
#48 - tibtibs (03/31/2014) [+] (15 children)
stickied by admin

A much more compact way to do the images, using pure css to expand the description and image on hover without moving anything around it. If you would rather for compatibility, it is possible with jquery and could flow a little smoother on hover.

No good way to do the menu/about us links, I would suggest putting an icon on one of the bottom corners with a slide out on hover menu for those.
#54 - furrypuppy (03/31/2014) [-]
Front page.
User avatar #98 to #54 - istartedthewar (03/31/2014) [-]
Seems like a nice tablet website.
#55 to #54 - furrypuppy (03/31/2014) [-]
Front page menu opened
#56 to #55 - furrypuppy (03/31/2014) [-]
Newest uploads opened
#57 to #56 - furrypuppy (03/31/2014) [-]
Notifications opened
#58 to #57 - furrypuppy (03/31/2014) [-]
More menu opened
#61 to #58 - furrypuppy (03/31/2014) [-]
Help menu opened.
User avatar #64 to #61 - therealsuperderpy ONLINE (03/31/2014) [-]
I really like this
If there was a dropdown for the boards it'd be perfect
#66 to #64 - furrypuppy (03/31/2014) [-]
Ah yes, those would fit in between the notifications and the Newest Uploads menu.

Same goes for the **** boards.
User avatar #68 to #66 - therealsuperderpy ONLINE (03/31/2014) [-]
Nice man.
Looks really modern and sleek
Looks kinda like outlook it's cool
User avatar #70 to #68 - furrypuppy (03/31/2014) [-]
The outdated look could be seen as a problem.

I mean, WE all love it because it's the FJ we know. But I think in order to gain more new users, it needs to look a little more up-to-date.
User avatar #71 to #70 - therealsuperderpy ONLINE (03/31/2014) [-]
Yeah I agree completely.
User avatar #77 to #71 - furrypuppy (03/31/2014) [-]
Looks like Addy already made a decision, though.
User avatar #72 to #66 - furrypuppy (03/31/2014) [-]
Also admin, with this as the top bar, you wouldn't need the side bar at all anymore.
#125 to #66 - anon (04/01/2014) [-]
Great design i love it <3

What about top comments?
User avatar #126 to #125 - furrypuppy (04/01/2014) [-]
Hadn't thought about top comments yet. maybe a similar bar at the bottom could be made for the rest.

It's not going to be chose anyways, soo <3
User avatar #62 to #61 - furrypuppy (03/31/2014) [-]
Credit to noobwilleat for the top bar menu

I added features to it.

#20 - wardd (03/31/2014) [-]
#49 to #20 - yrhcz (03/31/2014) [-]
This is what I was thinking with the only exception being to have the number of thumbs just to the right of the thumbnail or maybe a break between certain numbers, like a colored line that seperates content with 1000+ from 999-500 and 499- 250 and <250.
I usually start browsing at a content with about 250 and move left till I hit the top of the front page.
User avatar #23 to #20 - hashtronaut (03/31/2014) [-]
well, this is the 2nd comment I see on the list... and I don't think I need to even see what the 3rd is.

this gets my vote.
User avatar #41 to #20 - phanact (03/31/2014) [-]
Maybe to improve on this design, put a small scroll bar to the left of each of those boxes displaying content, so you can like scroll through the top 100 of the day or whatever (that's also affected by your scroll wheel obviously)
User avatar #26 - noobwilleat (03/31/2014) [-]
I didnt know what you meant so heres a thing i made on my website (yes my website its just a test dont make fun )
#27 to #26 - vigorion (03/31/2014) [-]
Looks awesome.
User avatar #32 to #26 - joemoearigato ONLINE (03/31/2014) [-]
Look really professional.
User avatar #33 to #26 - mrpotatofudge (03/31/2014) [-]
That's a pretty gay name for a website
User avatar #34 to #33 - noobwilleat (03/31/2014) [-]
:p my website is just a test meaning i havnt figured out everything for it yet
User avatar #36 to #26 - datmine ONLINE (03/31/2014) [-]
User avatar #38 to #26 - furrypuppy (03/31/2014) [-]
That is pretty cool, actually. Would be a huge improvement.
User avatar #39 to #26 - phanact (03/31/2014) [-]
I like it, but I think he's been looking for an upgrade to the one on beta.funnyjunk.com/
Also make the height a bit less, and personally I've grown used to the notifications in the middle but that's more of a personal qualm. But maybe you could make it fit the other things in the beta one somehow?
User avatar #40 to #39 - phanact (03/31/2014) [-]
plus I haven't checked out the others yet
User avatar #45 to #40 - noobwilleat (03/31/2014) [-]
He could just make a drop down and add the funny pictures and stuff but personally i like it on the side bar better
User avatar #46 to #45 - phanact (03/31/2014) [-]
yea but with the addition of hiding the side bar, people won't see stuff like that, that he's added onto it
plus we have like a few things above the page at the moment right now that would look better if they were removed
User avatar #47 to #46 - noobwilleat (03/31/2014) [-]
If you're talking about the channels and board i would but idk what he used to make those navbars so small.
User avatar #52 to #47 - noobwilleat (03/31/2014) [-]
this looks somewhat like it
User avatar #31 to #26 - noobwilleat (03/31/2014) [-]
oh yeah and just incase admin wants to know the scripting i used was bootstrap and the code is:
#102 - thealtman (04/01/2014) [-]
I don't have the time to do a custom code right now, as we are just a couple weeks from finals.

However, I think a Wah-Menu style would be great for this site:
You need to login to view this link

You can buy the code for 12$ and modify the style pretty easily, or just code it from scratch by the example.
User avatar #104 to #102 - Xaftz (04/01/2014) [-]
I could live with this.
#99 - gorillabutts (03/31/2014) [-]
Idk, it looks meh at the moment, but if I weren't sitting in bed trying to get this done in 30 mins, it might actually look good.
#4 - skiskate (03/31/2014) [-]
I don't have any idea how to make a navigation bar but please,please make the colors less vibrant.
User avatar #5 to #4 - Sunset (03/31/2014) [-]
yeah, white is horrible
User avatar #7 to #5 - skiskate (03/31/2014) [-]
So is neon green
User avatar #10 to #4 - cormy (03/31/2014) [-]
Turn down your contrast?
It seems to be a fad these days to make all colours everywhere as vibrant as possible so no matter what I'm using, I always turn my brightness, contrast and colour settings down to at least 50%. With my laptop I go even lower than that. 0% brightness.
Although I agree that a bit of grey could be added to the text colour I don't think this is a problem with FJ per se, just anywhere on a site with high-contrasting colours, which is why I suggest just changing your settings.
#15 to #10 - skiskate (03/31/2014) [-]
I ******* love saturated colors though.

I do video compositing with 4k film
User avatar #21 to #15 - cormy (03/31/2014) [-]
#35 to #4 - mrpotatofudge (03/31/2014) [-]
What do you have against vibrant colors
#106 - thedarkestrogue (04/01/2014) [-]
Instead of having people design one specific one, why not make a customization one?
Let people decide how much they want or dont want.
Like give them the ability to drag or lock in different links and get rid of the one sthey don't want.
#78 - Ryu (03/31/2014) [-]
Have the front page full title roll out and move the side navigation **** to the top and have drop down menus instead of the sideways ****
User avatar #115 to #78 - ninjawildcat (04/01/2014) [-]
That is a really good idea, and make it collapsible also for those who like militaristic designs
#67 - icameheretotroll (03/31/2014) [-]
This one is mainly for the top navigation bar not for the left
#65 - britbong (03/31/2014) [-]
You could choose between Top/latest/subs and depending on which one you choose, a different list of content would appear
User avatar #135 - scornedbythenine (04/01/2014) [-]
How about this admin ? it could be as long or short as you want it to be, green for not viewed, grey for viewed and purple for subscribed user content that you haven't viewed yet.

also cba to make all tiles unique obviously but you get the idea
#136 to #135 - scornedbythenine (04/01/2014) [-]
forgot to post the ******* pick, Admin have mercy
User avatar #131 - sirbrentcoe (04/01/2014) [-]
you should make it so that when you view a specific persons profile, the side bar becomes all of that persons content, listed chronologically.
#95 - istartedthewar (03/31/2014) [-]
This image has expired
Managed to keep the menu by shortening a few names and removing a couple, while still making it look nice.
Removed RSS, (who the hell uses it anymore), combined funny and youtube videos, removed user rankings. Then **** would show in for logged in users.

My design should save quite a bit of room, addy.

I just spent the last 45 minutes doing this and probably as soon as I post it every one else did the same thing
User avatar #96 to #95 - istartedthewar (03/31/2014) [-]
Forgot about about us, it could be put at the bottom like the majority of other websites.
User avatar #97 to #95 - istartedthewar (03/31/2014) [-]
Sorry, I also have no knowledge of CSS, HTMl, etc.
#69 - benjamino (03/31/2014) [-]
Here is a very crude version, but it's just to show you what I mean. Make it like this, then theres the added bonus of less horizontal and vertical space, plus it'll match the trending bar in design. On the frontpage, maybe hide it though, as the design may clash with the new one on beta.fj

Still, I think this will look pretty cool and it functions (Maybe make the squares bigger or something though, such as in rows of 2 rather than 3).
#12 - savaed (03/31/2014) [-]
if we can learn anything from your posts its this one thing

youve obviously never heard the term "if it aint broke dont fix it"
#37 to #12 - datmine ONLINE (03/31/2014) [-]
w0td u say m8
w0td u say m8
#30 to #12 - sry (03/31/2014) [-]
but the thing is
he's broke, so he has to fix it
User avatar #132 - skullzero ONLINE (04/01/2014) [-]
Can you please bring back the -50 thumbs ban thing, these ******* "trolls" are just getting annoying and probably decreasing the number of users that stay.
#138 to #132 - anon (04/01/2014) [-]
he did that a while ago.
#86 - kongaliver (03/31/2014) [-]
small adjustments to home page for FJ sporting colors
#76 - crocksandsocks (03/31/2014) [-]
Did this quick, I hope you like. Those arrows would scroll through top funnyjunk, and then there's more advertising of the boards so people actually use them, and then there's a donate button.
User avatar #59 - icameheretotroll (03/31/2014) [-]
What about on the left side of the navigation bar make just like trending and when you hover the mouse over the picture then it shows the title instead of the words taking space

the navigation for home, boards and stuff on the left corner of the navigation should open up by hovering over the "menu" first just like image boards opens up a window when you hover your mouse over it so it wont take as much space by making just the word "menu"
Leave a comment
 Friends (0)