Site Design
- Thread starter Pixel
- Start date
Lex
Administrator
OK there are things we need to discuss.
One - overhauling the menus. I'm kind of already dealing with that so I'll come up with a plan and post it here - the menu you see there currently is just the old one as an example.
Two - Colour scheme/ background. All of that is customisable, but honestly I like the dark grey background there at the moment? In particular what I like right now is how articles look. The large image, the title placement, all of it. The background - we can just use our current simple gradiant which I quite like. I'm not sure how to replicate that at the moment because it's not a simple image, it's CSS.
Three - space for ads (on the front page). IMO, a great place for a banner ad on the front page is directly beneath the menu. One underneath where "featured content" is doesn't seem a bad idea either.
Four - we need to update the site banner/ get a higher quality version. I like our current (old) site banner, I'm not saying it should be changed (but feel free to suggest that yourselves), but pixellation is definitely noticeable even when it's slightly enlarged, and we need an image twice that size for retina displays.
also moar
One - overhauling the menus. I'm kind of already dealing with that so I'll come up with a plan and post it here - the menu you see there currently is just the old one as an example.
Two - Colour scheme/ background. All of that is customisable, but honestly I like the dark grey background there at the moment? In particular what I like right now is how articles look. The large image, the title placement, all of it. The background - we can just use our current simple gradiant which I quite like. I'm not sure how to replicate that at the moment because it's not a simple image, it's CSS.
Three - space for ads (on the front page). IMO, a great place for a banner ad on the front page is directly beneath the menu. One underneath where "featured content" is doesn't seem a bad idea either.
Four - we need to update the site banner/ get a higher quality version. I like our current (old) site banner, I'm not saying it should be changed (but feel free to suggest that yourselves), but pixellation is definitely noticeable even when it's slightly enlarged, and we need an image twice that size for retina displays.
also moar
Cthulhu
Administrator
- AKA
- Yop
Looking good, 
. Make sure to cross-reference on mobile phones and shit too.
The old social media plugin was called Flare, IIRC. Not sure.
I like the idea of the background, but atm / on my screen / resolution (1920x1200) it looks kinda tiled, which I don't really like.
You could probably ask Pixel for either a higher resolution version or the original PSD of the banner. Alternatively / additionally, browsers are slowly starting to adopt the <picture> tag, which allows a site to offer multiple resolutions for a given image, which the browser can pick / download depending on its resolution (so the smallest for a 320px wide thing and the biggest for a 5K retina display or ipad pro or whatever).
Alternatively, a remake of the banner but in a somewhat more abstract style could be attempted; then, it could be served as a SVG image, which is a vector image format (i.e. instructions about how to draw it, instead of (compressed) pixel / color info in a 2d grid).
We'll have to figure out what to do with pages like this; a quick 'click to enlarge' action would probably work best, using smaller images by default.
. Make sure to cross-reference on mobile phones and shit too.The old social media plugin was called Flare, IIRC. Not sure.
I like the idea of the background, but atm / on my screen / resolution (1920x1200) it looks kinda tiled, which I don't really like.
You could probably ask Pixel for either a higher resolution version or the original PSD of the banner. Alternatively / additionally, browsers are slowly starting to adopt the <picture> tag, which allows a site to offer multiple resolutions for a given image, which the browser can pick / download depending on its resolution (so the smallest for a 320px wide thing and the biggest for a 5K retina display or ipad pro or whatever).
Alternatively, a remake of the banner but in a somewhat more abstract style could be attempted; then, it could be served as a SVG image, which is a vector image format (i.e. instructions about how to draw it, instead of (compressed) pixel / color info in a 2d grid).
We'll have to figure out what to do with pages like this; a quick 'click to enlarge' action would probably work best, using smaller images by default.
Lex
Administrator
Mobile version has complete endless scroll, as in I can never get ti the bottom of the page; this bothers me
Nitpicking ofc, looks good
It bothers me too, I'm glad it's kind of seamlessly functional while editing the desktop version though. There are options to turn off mobile compatibility for certain functions like menus, but as long as I make sure they're enabled it should be fine.
We should vote on endless scroll for sure, but likely I'll end up making sections for news and other stuff rather than just having endless articles on the front page. IMO we'll probably end up going static front page anyway for extreme raisins such as being able to get to the login button at the bottom XD. If we end up doing endless scroll we'll need to remove the footer obvs, and there should be an option or a way to edit the CSS so that endless scroll only happens on desktop and not mobile.
Looking good,
Don't worry, any time I make large changes I check it on multiple browsers and my telefonica also
Cool, I deactivated it <3. Looks much better with the slightly larger theme ones, there'll be an option somewhere to disable the icons we don't want.
Don't worry, it's literally just an image I found on google that I threw together. It's definitely not tilted in any of the ways I've checked though. It was just looking incredibly ugly with a block colour as the background tbh XD.
We could even make different backgrounds for the site as remake stuff comes out, it's an idea I like but it could be cumbersome to keep making different images that suit the colour scheme.
Awesome, I'll look into it. Re: the site banner, I've asked Pixel for the original PSD files and he's provided them. It's as low res as our current site banner. I have no idea how he managed to make something so pretty without making it utterly massive, but it's possible he was creating it on a low-res screen back when it was first made. Hence the fairly low res. There's no real way to upscale it without losing detail, I even tried making the objects 3D. Might need to be recreated. It would be a good time to update it, but IMO it's pretty iconic and I love it, I don't particularly want it to change.
Most hopefully <3
Absolutely, a lot of the articles will need to be reformatted. One very important thing about Smartmag (which is the one you're currently looking at) is that it makes Shademp's tables actually look good. Aside from them not being centred, but that's easily remedied.
Also need to give it our flair with some materia orbs on section headers and things, still working out the best way to do that. I'm gonna run through the same shit with fraction shortly too, so we can compare. One thing that's causing me to lean towards smartmag at the mo is the mini navigation bar at the top, which is something fraction doesn't have. This addresses Claymore's suggestion that you get easily lost on the site and can't find content. It fixes that problem while also being neat, stylish, and not taking up a lot of space. I don't even know where the function to mess with it is though, I'll need to find it XD.
Cthulhu
Administrator
- AKA
- Yop
I do like the idea of changing the background or other visual elements every once in a while; we could just make a number of theme images or things from the game and rotate them monthly or something, or make them topical to events like playthroughs or podcasts or something like that.
Obsidian Fire
Ahk Morn!
- AKA
- The Engineer
If you want to make images in SVG format, I highly recommend Inkscape, which is open source to boot. It's gotten to the point where it's replaced Adobe Illustrator for me because of it's UI (and being able to get XML images without a lot of work is nice).
I could probably try my hand at making an abstract version of the Lifestream background if Pixel's okay with it.
I could probably try my hand at making an abstract version of the Lifestream background if Pixel's okay with it.
Lex
Administrator
I'll give him a nudge on FB if he hasn't responded here in a little bit
I can do a tiny bit of photoshopping, editing images (see sig) but I'm clearly not skilled or trained in any way. I just downloaded it when I was like 13 and started messing around, and I've been doing that ever since
(I'm saying I in no way want to edit images that will appear on the site unless it's for an article or it's just a simple screenshot background).
I can do a tiny bit of photoshopping, editing images (see sig) but I'm clearly not skilled or trained in any way. I just downloaded it when I was like 13 and started messing around, and I've been doing that ever since
(I'm saying I in no way want to edit images that will appear on the site unless it's for an article or it's just a simple screenshot background).
Pixel
The Pixie King
What size does it need to be. I can't remember if it was ever in a highr res. I have no training in photoshop either, so it was kind of just thrown together just to make it look kinda pretty with no technical ability. The logo could do with being reworked a bit. I hate that S
The older files might have higher res assets, but later versions have updates done on the lower res version. It might be better to redo it from the ground up.
The older files might have higher res assets, but later versions have updates done on the lower res version. It might be better to redo it from the ground up.
Lex
Administrator
The boxed site widths are slightly different for both smartmag and fraction. Right now smartmag needs somewhere around 1100pixels in width and we need twice that for retina displays. IMO go for 2500-3000 pixel width and I can just work from resizing that image to multiple smaller copies to fit our needs.
Cthulhu
Administrator
- AKA
- Yop
Ooooo~
One thing I'd like to note is that especially in the wide banner, the er, marbling? on the title blends in with the background, cutting up the letters and making it a tad harder to read. That + the logo and background is bright on bright, as channy noted, but IDK, that may have been your intention.
...and where did you hide the Aerith,
One thing I'd like to note is that especially in the wide banner, the er, marbling? on the title blends in with the background, cutting up the letters and making it a tad harder to read. That + the logo and background is bright on bright, as channy noted, but IDK, that may have been your intention.
...and where did you hide the Aerith,
Claymore
3x3 Eyes
I never noticed that before. That's actually pretty neat.