Jump to content

Photo

New Nexus site design and future


  • Please log in to reply
59 replies to this topic

#1
Dark0ne

Dark0ne

    Webmaster

  • Admin
  • 21,417 posts
I've mentioned in past blog posts that I have started to reach the crux of my talents and time in regards to the Nexus sites. Over the past 10 years I've been working away at the sites when I can, in between school, work projects, and then university, and the sites have continued to grow organically during this time in to the rather large entity they are today. Almost 2 and a half million members and growing, hosting almost 50,000 files across 5 sites.

Back in December 2010, before the announcement of Skyrim (but in anticipation), I set plans in to motion to really kick-start things here at the Nexus. 2011 was and is going to be the year of advancement, development and improvement for the Nexus as I devote more of my time and resources in to pushing it on; increasing our functionality and increasing our reach.

There are three core areas I'm focusing on; the front-end (the look of the site), the back-end (the features and functionality) and something completely separate that I'm not going to talk about today. The plan is to work on the core foundation of what makes the Nexus sites special and useful to users (ease-of-use, speed, efficiency, helpfulness, etc.) before I even think about any sort of expansion.

I'm wary of many gaming community sites past and present that have expanded too-fast, too-soon. They expand out dramatically fast and reach a critical mass before imploding. These types of networks tend to have masses of bloat, masses of fluff and very little usefulness or content for the end-user. It's not what I want the Nexus to be or become and my aim has always been to take it easy, play it safe, and only to branch out in to areas I know about and enjoy. At the end of the day, the worst thing that could happen is for me to over-extend myself, burn out and waste away what the community has built here.



Dedicated staff

Back in February I put up a news post in regards to the Nexus looking to hire a dedicated PHP programmer. Several people applied for the position and I was extremely lucky to come across someone who fitted the bill perfectly; he programs in lots of different languages, he's a quick learner, he speaks English and lives in the UK, he's willing to travel to come see me, importantly he can work very well autonomously and most importantly he's an actual user of the sites so he knows how it all works, what people want and what people need. http://www.thenexusf...owuser=1560488'>AxelDominator is working full-time now in the background on the Nexus sites. I say full-time, I'm pretty sure he's working much more than that as he's up until 4am some mornings working on something. Crazy person.

Axel is currently working on completely rewriting the Nexus sites in to his own framework and code; making it more efficient and more secure while adding some nice functionality along the way. His remit right now is to recode the sites and hold on to all the current functionality; so the only things you'll see are super-cool nice changes like a global login system so when you're logged in on one site you're logged in to them all. The transition over to Axel's work won't be happening for a while as the current focus for the sites is on the site redesign, that has been mentioned in previous blog posts.

Having said that, I have grand visions and plans for the future and Axel shares them. With Axel onboard the possibilities for both current and future sites grow greatly, and I'm excited about that.



New site design

It's been a few months now and the web site designer I hired to work on a new design for the Nexus sites has handed over his completed pages and I'm now working hard to get all the current Nexus content moved over to this new design.

The designer himself is actually one of my housemates. He works for a major web developer in the UK, he's an avid video gamer (albeit not really focusing on single-player games) and he actually helped to develop the original Nihilum/Ensidia World of Warcraft guild website. It might not sound like much to you, especially if you don't know who they are, but they're actually one of, if not the biggest WoW guilds and are dominant in pro-gaming circles. The site was a feature-rich social networking site that has similarities with the Nexus sites, so his expertise are great to have.

For now the focus is literally on getting all the current Nexus site code and functionality integrated in to the new design. There aren't going to be any major new features or changes, aside from the new design, in the initial move over. I want to get the design right before I worry about anything else, and I don't want to overburden you by dumping a load of changes on to you all at once.

Before I give you the links let me just put on my tin-foil hat, grab my meat-shield and put on my protective cloak as I'm aware that changes are rarely welcomed. Especially when people think something isn't broken. Indeed "if it ain't broke, don't fix it" is a favourite quote of mine, but to me the original design was broken, both in terms of it being actually broken (run it through a W3C compliance program and you'll see what I mean) and being not fit for purpose. You see, the TESNexus design was cooked up in an extremely short space of time back in 2007 when TESSource went down for 3 weeks and the sites came back as TESNexus. I was in a massive rush to get something out the door as quickly as possible as there were thousands of mods inaccessible during this period and lots of stuff had to be over-looked or compromised on in order to get back up and running as quickly as possible. The design was one of those things, and for months afterwards many people complained about the design, including the navigation being on the right or the fact it just wasn't as good as TESSource. Over-time people got used to the design, they realised that the functionality was much better, that there was a lot more good stuff going on, and all was forgotten.

I have been wanting to redesign the sites for years now. The code is an absolute mess and it makes simple function updates or additions take much, much longer than they should because the HTML and CSS is so shoddy. It's a nightmare for me to work with. I wanted something I could be confident in and happy to use, and this new design ticks both those boxes perfectly. To me, and for me, this new design is fantastic.

The move over to the new design is going to take some time as there's lots of pages and small code re-writes to get through, but I've now completed enough of the core pages on the site to be able to provide you with some examples of what the finished product is going to look like. Naturally things are subject to change, and none of the pages are 100% finished yet, but I'd say they're all 90%+ close to being the finished product. If you click a link and it doesn't do anything, it's likely that functionality hasn't been added in yet.

So, with that out the way, take a look at the test site and let me run you through it a little bit.

Before I talk about individual page functionality let's talk about the general site design, the header and footer of the site. Perhaps the biggest cause for concern will be the fixed width nature of the site. Let me start by saying that I run a dual-monitor set up, both at resolutions of 1900x1200 so I know what it's like to browse a site that doesn't use all your monitor space. Having said that, I have also been working with a fluid width design for the past 10 years and I can also tell you how much of a massive pain in the ass it is to work with. Is the effort I go through to try and make the site work on as many browsers and resolutions as possible any of your concern? I guess that depends. But let me just say that I, personally, am happy with it, but I understand why you might not be. The aim is not to let that space either side of the main content area go to waste, and we'll likely be skinning the sides, and opening up the margins for mod authors to skin their own pages. Axel has already implemented systems in to the new framework that is going to enable mod authors to modify certain aspects of their pages, way beyond what they can currently do, so hopefully this will go some way to making use of the free space available.

Among a few test subjects the next point of contention has been the bright orange colour. Colours are very easy to change so if your main gripe with the new design is the colour then make your voice heard, but don't worry too much about it.

You'll notice that the right navigation system has been removed to make way for more content in the centre. Instead the navigation can be accessed from drop-down menus at the top of the page, and also at the bottom of the page where a simple to use links system is available.

The main content area is split in to two columns, left and right. The left hand column will be used for main content. The right hand column houses an advert (if you're not a premium member) and additional content relevant to the current page you are on.

That's the main design in a nut-shell. I'll now run you through the individual pages that are currently available and on show.

The first page is naturally the front-page of the site. You'll immediately notice a remastered hot files system has been implemented. The preview images are larger, you get a small description of the file and there's some swish preview thumbnails to play around with. The hot files system is going to be changed a bit. It'll now display the top 5 endorsed files from the past week, rather than 21 days. It should make the system a bit more fluid so that each day (or maximum, week) there's something new to look at on the front page. Because the hot files image is larger there are going to be restrictions put in place on the size of primary images on your files, to the tune of images less than 1024 pixels in width won't be accepted. If you have primary images smaller than 1024 pixels in width then the hot files script will go through all your images until it finds one, or if it can't find any then your file will be omitted from the list and the next candidate on the list will take your file's place. It might sound harsh, but Axel's going to be coding in some checks and notifications to let you mod authors know whether your image will be acceptable in the hot files system (and maybe even offer you a preview of what it will look like).

The news follows below the hot files system. Right now it's pretty standard, and you can sort the news by specific categories. The addition of some news staff in the past year has nicely branched out the content offered by the Nexus so we're not just some place you go to for file downloads. Reporting on the news, bringing more members in to the community spotlight and highlighting great mods and endeavours in the community is something I'm really pushing for, so expect the news and other non-files content to get a bit of a nod in the right direction over the coming year.

On the right you'll notice some lists for files and news for easy access.

Lets move on and take a look at the downloads index/category list. The old file index page is going to be replaced by this page as I think it's more intuitive. When you click on the files tab you expect to be taken to a list of file categories, rather than another placeholder page with the latest updates. You'll notice not much has changed from the current design, the way the categories are displayed remains the same, just in a different shell.

If you click on any category you'll be taken to an individual file category page, which lists all the files in a particular category. This list can be manipulated in much the same way the current lists can, allowing you to sort the results by varying parameters. You can also perform a tag search by clicking the "find exactly what you're looking for with tags" link, which will provide you with a drop-down for tag selections. The tags you select are highlighted in the list when the page reloads for easy adding and removing.

The file information is displayed in a flat-format. I often forget that the current Nexus sites have a flat-mode and block-mode option in the preferences; I have always used flat-mode. The block-mode option will be removed in the new design, both because I do not want to be supporting two separate modes and because the block mode won't fit in with the fixed-width design.

One feature of note is the "preview" link underneath a file's small description. Clicking this link will open up a file page's full description in an overlay box without you leaving the page so you can see exactly what a file is about without having to leave the category.

On the right column are top lists for the most endorsed file in this category, and the most downloaded files in this category. A "random files" box may also be added.

Clicking on a file will take you to the file's page.

You'll notice the image carousel has been replaced by a more functional one. Using the arrows will take you through your image gallery three images at a time, and clicking an image will expand it out without reloading the page, like the image gallery.

I've added a download link to the UI. Lots of newcomers get confused without an obvious download link. Clicking it will take a user to the files tab, rather than download the file straight away. In a way some mod authors have become reliant on the ability to upload multiple files for an individual file page, so offering a one-click download button just isn't feasible as many mod authors offer many optional extras that would be missed, or they don't upload the latest version of their file in to the main file but instead require you to download the main file, and then the patches afterwards. The "vote for me" (file of the month vote) and "endorse me" buttons are currently non-functional.

Each of the file tabs; description, files, images, comments, discussions, tags, videos, mirrors and readme have been reworked and redesigned so click through each to take a look at them. Files are now listed in flat-mode, the image gallery has been made more compact and swish, and you can toggle between author images and user uploaded images, the comment system has had an overhaul so there's less wasted space, and the AJAX has been tidied up some more, tags are laid out differently and it's all AJAX'd so you don't have to reload the page. The tags are now coloured so you can better understand the situation of each tag; red means an author has denied the tag, orange means users have suggested the tag for confirmation, and green means a tag has been confirmed. Videos have been tidied up some more, as have mirrors, and the ReadMe has replaced the action log as a tab, placing your readme text straight in to the page which I hope some authors like. The action log isn't currently featured on the page, but it'll be there come the launch.

On the right column are your stats and some action buttons for tracking and reporting a file, adding images, viewing the required files, permissions and credits and contacting the author. The action log will also feature here in due time. Underneath is a list of some of the author's other work that's been uploaded to the site, if there is any.

If you have files on TESNexus and you'd like to see how your file will look in the new design then simply remove the www. from the URL of your file page and change it to "platform". So http://www.tesnexus....le.php?id=38781 becomes http://platform.tesn...e.php?id=38781. Data is live, but if you've uploaded any new images recently they might be broken and show as empty.

That concludes the currently finished file pages right now. Moving on, the Image Share has also been revamped, removing a lot of dead-space and compacting everything nicely on to the page. The view count and endorsement count are a bit hard to read at time of writing and it'll be touched up soon to make it better.

Clicking on an image in the list will take you to the image page that has been modified substantially from the current system. A large preview of the image is visible at the top, and clicking it will expand and magnify the image rather than load a separate page. Below the image you'll see the description of the image, if the author has left one, and below that the comments are instantly visible, rather than a tab needing to be clicked. Many mod authors don't leave descriptions with their images now so it made sense to have comments visible from the start, rather than an optional extra.

The compression levels on thumbnail images in both the Image Share section and file section is going to be improved. Have you noticed that the thumbnails can sometimes be bad quality or blurry? That's because they've been compressed to save on hard-drive space. The compression level is going to get tweaked so thumbnails are going to look way better come the launch of the new design.

In the right column are the image stats, along with a list of some of the other images the author has uploaded to the Image Share section.

Right now that concludes the examples on offer for the new design. Before you click that "add comment" button and start listing all the things you don't like or would change I'd like to tell you that I really like this new look, and I hope you do too. Having said that I know some of you will have concerns and maybe even some of you will downright hate it. I can understand that, but give me a reason to listen to you past "I don't like it".

I love Wayne's World, it's one of my favourite films, and whenever I change something on the sites and some people go bonking mad about the change without justifying their reasons I can't help but recollect this scene from the first film. It starts off with me proposing the change (Rob Lowe asking "How do you feel about making a change?"), people go bonkers in the comments (Garth starts hammering the moving hand, or my head), and once the dust has settled I end up making that quizzical look Robe Lowe has on his face with an uneasy stare across to the people expressing their dislike, and that music rings in my ears.

If you like the way the new design is looking so far then feel free to express it, if you dislike it then let me know what you dislike, what you'd change and why you'd change it, and if you hate it...I'm sorry, but I'm not sure there's much I can do for you. If you know why you hate it then let me know, but if you don't have a good reason then please could you hammer that robotic hand away from me?!

#2
bigcrazewolf

bigcrazewolf

    Enthusiast

  • Premium Member
  • 240 posts
:thumbsup: I like the look and layout, comes off more professional, I don't find anything wrong with the current Nexus site I will add (so no one gets upset with me)

Keep up the good work and thank you.

#3
zombieslayer002

zombieslayer002

    Sarcastic Nice Guy

  • Banned
  • PipPipPip
  • 522 posts
looks great. in all honesty it was such a subtle transition to the new look that i hardly noticed it :happy:

#4
Pronam

Pronam

    Member

  • Premium Member
  • 4,069 posts
I like the 'More from this uploader' thingy :D

Edited by Pronam, 07 July 2011 - 05:06 PM.


#5
marsher

marsher

    Enthusiast

  • Premium Member
  • 177 posts
It looks fantastic! Amazing job!

The image function is somewhere around 400 billion times faster and more fluid.
Featured files on the homepage are actually browsable(is that a word?)
Search is easy to find
Browsing is easier
I love seeing download, vote, and endorse as 3 easy, uniform buttons.
3 images at a time on top of the file menu: perfect.
And a lot more that i havent discovered yet.

I would like to point out a few SMALL things.

The number on the endorse button seems to be messing with the shape of the button. maybe try having the number/text layout similar to the chat function on the top of the page?
There is, in my opinion, too much on the bottom. Drop down menus might be a good idea.
And lastly, its tiny but its aesthetics, i think mousing over nexusnetwork should change nexus to be the color of network, and not have it all turn grey.

BUT like i said, its amazing, you and your crew did a fantastic job. Keep up the good work, I can't wait to try it out.



#6
KDStudios

KDStudios

    The Master of Puppets

  • Supporter
  • PipPipPipPipPip
  • 3,592 posts
I've had a play around on the test site.
The design is solid I like it.
The layout works and I'm pretty sure after a week I'd be used to it.

I'm not too certain about the tesnexus icon though.
I have no idea what I don't like about it. It just looks... Out of place.
Is it the universal icon for the nexus?

I am concerned about the reputation system. I hope you'll be adding a rule against people that say "Thumb this up if..blahblah" I'd rather this not turn into youtube.
But I am very happy that we can change our minds later :)

I've noticed on the mod file page there are icons to the different "Tabs" of the old nexus.
Perhaps you should make more detailed icons for them? I was curious as to which icon actually did which, the only three I understood were the images, videos and comments icons.
Either that or change the numbering system to names of the tabs? :) All those "000"s are daunting.

All in all, the site has taken the right direction and looks very functional.
I'm going to play with it a little longer, to grab the feel of it.

I do have one important question though.
Will the Fallout 3 nexus, new vegas nexus, dragon age nexus etc look exactly the same but different colours like they are now? Or have unique changes in them. Such as Fallout icons for Fallout, Dragonage icons for DA?

Good luck with this anyway Dark0ne :)

#7
razorpony

razorpony

    Stately Steed

  • Supporter
  • PipPipPip
  • 662 posts
I think I like the current look at bit better from a colorscheme standpoint. I use the dark interface and it suits my eyes.

However:

If the current setup is broken behind the scenes then I can see why you want to change it around. The new interface does have a cleaner and more professional look to it, I'm just a bit hungup on the orange. The grey background and the black textboxes (on the file listing especially) makes the bright orange much more jarring. It doesn't stick out so badly on the mainpage. I'll also miss block mode but hey, omelettes require a few broken eggs and all that.

My request would be this, if possible: That we could have a dropdown box similar to the one we currently have that allows us to switch between 2 (or more) color schemes. I think that would help stem complaints greatly.

Thanks for the continuing work and dedication you put into these sites. I can't wait to see what else the future holds.

RP

#8
bben46

bben46

    I had a title once, but I forgot what it was.

  • Premium Member
  • 24,973 posts
I like it the orange is not too overpowering at all and goes well with the dark background. :thumbsup:
I had no trouble at all navigating around it either.
My rating so far: I give it 3 bananas out of 3. Posted Image Posted Image Posted Image

#9
AurianaValoria1

AurianaValoria1

    Tamrielic Thedosian

  • Premium Member
  • 26,607 posts
Awesome work! :smile: The new site definitely looks sleeker. I especially like what you've done with the hot files, the news, and the image share. It's very easy to navigate.

However, I must say that I am not a fan of the orange, either. I agree with razorpony's idea: if you can implement it, let us choose from a couple of different color schemes.

Thanks for all the hard work. I understand that this is a huge site, and you have to do whatever it takes to manage it.

#10
Flintlockecole

Flintlockecole

    Palkkasoturi - Mercenary

  • Supporter
  • PipPipPipPip
  • 1,654 posts
Look's nice.




IPB skins by Skinbox
Page loaded in: 0.978 seconds