(Warning, super noob design ahead)
I constructed @Austara's Official Character Files back in 2010 as a way to archive all the backstories and costumes for the superheroines I created on the MMORPG City of Heroes. Unfortunately, though the content archive is great, the design looks dated, and not in a cool vintage way. >_<
I've got some vague ideas on what I can change and edit, but I've been kind of stuck on how to go forward. What would y'all suggest? (Also looking for a better title for the site)
@Austara's Official Character Files
Forum rules
The usual guidelines in Constructive Criticism apply, and you have the option to flag your topic as "Sweet".
The usual guidelines in Constructive Criticism apply, and you have the option to flag your topic as "Sweet".
Re: @Austara's Official Character Files
Maybe adding more color to the design will make it more "lively" What kind of layout do you have in mind? Are you planning to stay with the file style? Some shadows and textures could help bring it out.
-
- Administrator
- Posts: 2535
- Joined: Thu Jun 21, 2012 5:49 pm
- Contact:
Re: @Austara's Official Character Files
- I second Mikari's suggestion on adding shadows and texture. If you want to still have it look like it's files, then maybe you can have a subtle paper texture over it all. Also, you could make the tabs look like actual tabs with the help of some drop shadows and a little bit of rearranging things around.
- You could add more padding around the content box; it's kinda snug
- The headings could be a different font. Still the same type of monospace stuff, but different for contrast. Probably something very vertical and heavy to contrast the very horizontal and light body font you have. You could also play with negative letter-spacing to make that work out.
- In the character pages: you could have a bit more air between the title and the rest underneath, make sure that the title actually aligns to the left with the rest of the content, add cursor: pointer to the titles to expand so that they feel more clickable. Hell, even cursor: help if you feel like fun.
- Make links be more clearly links. Right now they are the same as the rest. Underline, a different color, bold...the possibilities are endless!
- The background of the page could be something fun! What about wood, so it looks like a table? Maybe with some fun things on the table that remind you of the characters and stuff? I recommend that if you keep the layout itself light, make the background be darker, or viceversa. Right now it all kinda blends.
- Title-wise: I don't know, but you could probably pull off something more fun than this. Maybe these are not just the official character files. Maybe they are the super-duper-mega-secret-for-your-eyes-only character files. Maybe not exactly like this, but you see the direction I'm thinking of? :D
-
- Communications Staffer
- Posts: 1078
- Joined: Sat Oct 13, 2012 7:55 pm
- Location: Canada
- Contact:
Re: @Austara's Official Character Files
Paper textures on SubtlePatterns to add to what DD just said.
Join in the Tale, in the Blight, of Conquest and Lies
Come the Sun, to Tarnish in the Sky
Vow that we shall Tear the Light - Dark seizes the Throne
Lost in thoughts, all alone
Come the Sun, to Tarnish in the Sky
Vow that we shall Tear the Light - Dark seizes the Throne
Lost in thoughts, all alone
-
- Administrator
- Posts: 2535
- Joined: Thu Jun 21, 2012 5:49 pm
- Contact:
Re: @Austara's Official Character Files
Haha, I was even about to link to that and then I didn't. Great minds 8)
-
- Communications Staffer
- Posts: 1078
- Joined: Sat Oct 13, 2012 7:55 pm
- Location: Canada
- Contact:
Re: @Austara's Official Character Files
High five! XD
Join in the Tale, in the Blight, of Conquest and Lies
Come the Sun, to Tarnish in the Sky
Vow that we shall Tear the Light - Dark seizes the Throne
Lost in thoughts, all alone
Come the Sun, to Tarnish in the Sky
Vow that we shall Tear the Light - Dark seizes the Throne
Lost in thoughts, all alone
-
- Events Staffer
- Posts: 3072
- Joined: Thu Aug 07, 2014 3:15 pm
- Location: North Carolina, USA
- Contact:
Re: @Austara's Official Character Files
@Mikari and @Dubs: Back in 2010 I was trying to go for the "super-secret-dossier" look for the layout, but I had to make all the images myself due to shitty dialup internet at home (read: won't download a thing, LOL). Back then I also had no idea that CSS shadows and downloadable textures existed, either! xD (Thank you for the paper texture link, Nyx!)
Layout Design:
I like the rich dark wood background idea with each character page "lying" on the "table" surface. GOD that would be amazing. It would be even cooler if I could make it where you "flip" through each of the pages by clicking a left or right arrow, and where when you scrolled down to the bottom of each page, the pictures of costumes would kinda splay out on top of the "paper" able to be clicked...but that is probably a ton of animation >_< I hate not being much of an artist, lol
Information Organization:
One thing that has bugged me about this layout is how information is displayed on each character page. I ended up using the Javascript hide script so that it didn't look like "OMG WALL OF TEXT," but I really hate hiding the information behind a click. The layout can definitely be wider--I was stuck in my "ZOMG 900 PIXELS WIDE IS MAXIMUM WIDTH" phase then--but I just didn't really know how to arrange the information so that it looked readable. V_V
Title:
I just completely blanked on the title back in 2010, and had to come up with something besides "Super Cool Shit I Wrote About My Original Characters" xD Maybe just the word "Dossiers" would be cool as a title? Or--hmm--"Paragon City Dossiers?" Something like that?
Also, Dubs, you mentioned something about headings not aligning to the left with everything else--I tested it in IE, Firefox, and Chrome and didn't see that happening in my browser. Would you mind screenshotting it?
Layout Design:
I like the rich dark wood background idea with each character page "lying" on the "table" surface. GOD that would be amazing. It would be even cooler if I could make it where you "flip" through each of the pages by clicking a left or right arrow, and where when you scrolled down to the bottom of each page, the pictures of costumes would kinda splay out on top of the "paper" able to be clicked...but that is probably a ton of animation >_< I hate not being much of an artist, lol
Information Organization:
One thing that has bugged me about this layout is how information is displayed on each character page. I ended up using the Javascript hide script so that it didn't look like "OMG WALL OF TEXT," but I really hate hiding the information behind a click. The layout can definitely be wider--I was stuck in my "ZOMG 900 PIXELS WIDE IS MAXIMUM WIDTH" phase then--but I just didn't really know how to arrange the information so that it looked readable. V_V
Title:
I just completely blanked on the title back in 2010, and had to come up with something besides "Super Cool Shit I Wrote About My Original Characters" xD Maybe just the word "Dossiers" would be cool as a title? Or--hmm--"Paragon City Dossiers?" Something like that?
Also, Dubs, you mentioned something about headings not aligning to the left with everything else--I tested it in IE, Firefox, and Chrome and didn't see that happening in my browser. Would you mind screenshotting it?
-
- Administrator
- Posts: 2535
- Joined: Thu Jun 21, 2012 5:49 pm
- Contact:
Re: @Austara's Official Character Files
It's an extremely subtle thing:
REALLY subtle but kinda throws off the eye since that W is on every page.
![Image](http://rigelatin.net/temp/test/austara.png)
-
- Events Staffer
- Posts: 3072
- Joined: Thu Aug 07, 2014 3:15 pm
- Location: North Carolina, USA
- Contact:
Re: @Austara's Official Character Files
Hmmmmm. There's no additional padding on the "Codename" line or anything (just checked)--it must be something weird about the Courier New font. Perhaps simply changing the heading font like you suggested before will fix that too. Thank you for catching that!