Forum:Project Flemeth: Main page redesign

Forums: Index > Wiki DiscussionProject Flemeth: Main page redesign

Note: This topic has been unedited for 4912 days. It is considered archived - the discussion is over. Do not continue it unless it really needs a response.

Main page mockups

The center portion is intended for a portal (example Content Portal at Fallout). It would take the place of our navbar and would serve as a launch point for new visitors.

Without further ado

Mockup 1, Tan titles, no explicit borders

Mockup 2, Classic red splatter title bars

Mockup 3, New borders! Glowy!

Mockup 4, Red titles, no explicit borders. Like Mockup 1 with red!

Please peruse (and ignore the ugly red bar at the top)! -- tierrie talk contr 06:34, October 21, 2010 (UTC)

Main page discussion

My personal preference is for File:Mockup 01.png. I like the way it looks like news, but I dislike that there's no image in my mockups. Rest assured that in the final design the daily images/video/etc and other components will make an appearance. The only one I truly dislike is File:Mockup 02.png as it features a very aged design. When we change our background it will look horrendous. -- tierrie talk contr 06:34, October 21, 2010 (UTC)

Keep in mind that I plan to revisit this AFTER a new background is chosen. -- tierrie talk contr 06:46, October 21, 2010 (UTC)

I prefer no.1. Too many borders that close is distracting. No.4 could be used with perhaps a slightly darker shade of red; the current red is a bit too saturated. No.2 is a definitive no, overdose of the blood spatter background.

Is there a particular reason why the quote box uses Verdana?

We should probably move the discussion with your mockup (or the other way around), it'll be easier to give feedback. --D. (talk · contr) 17:02, October 21, 2010 (UTC)

One suggestion regarding the borders or making the boxes more distinctively separated: we can separate each box with either darker border or background, as long as it isn't "in your face". Also, the twitter section should probably clarify that it isn't the wiki's twitter, but the official one. --D. (talk · contr) 17:10, October 21, 2010 (UTC)

There's no particular reason the quote box uses Verdana. As a matter of fact, I think that it would be better off if it used a different font. For the time being, I'm focusing on the layout and style.

I'm also leaning towards Style 1 myself, with Style 4 being a close second. I also agree that the background should be greyed in a bit to subtly delineate between separate categories -- tierrie talk contr 20:02, October 21, 2010 (UTC)

I find myself disagreeing on this one. I like borders, they make the page look cleaner and more organized in my humble opinion. I like #3 the most. It looks rather stylish to me, and even manages to somehow make the rather disordered looking twitter section look a little cleaner just by association. Of them all, #3 is thus my favorite. -Vim- (talk) 21:02, October 22, 2010 (UTC)

@-Vim-, take a look at Portal:Mockup. I incorporated some changes that users were concerned about - primarily that the borders were not delineated enough. It looks amazing in CSS3 browsers and looks good in older CSS2 browers. Check it out and let me know if you still have a concern. I will try to and address them. -- tierrie talk contr 22:28, October 22, 2010 (UTC)

Until we ditch the white lettering on black background, I won't be happy, but I know I'm in the minority. Everywhere else in the world we have dark letters on light backgrounds. LVTDUDE (talk) 22:43, October 22, 2010 (UTC)

@LVTDUDE, that's an unreasonably non trivial request for one person's comfort. Instead, I recommend the personalized css style sheet. That will allow you to change the colors of the text.

The other suggestion is to make mockups and design it yourself then propose it to the community. If you're willing to do the coding and the community feels that it is an improvement over the current color scheme, then either I or one of the other admins will be glad to implement it. -- tierrie talk contr 23:18, October 22, 2010 (UTC)

The last suggestion is persuade Loleil that this is an absolutely brilliant idea and that its absolutely the next best thing to sliced bread. If she likes the idea and wants it to happen, I might be able to shuffle some time around to do a mock up. -- tierrie talk contr 23:20, October 22, 2010 (UTC)

I like the red splatter but maybe could we see that with the borders? --Tsavi (talk) 03:50, October 23, 2010 (UTC)

@Tsavi, I'm not quite sure I understand what you mean there. Could you repeat what you said differently? -- tierrie talk contr 18:31, October 23, 2010 (UTC)

@User:Tierrie, Mockup 2 and 3 combine them. The red splatter banners with the borders. --Tsavi (talk) 20:21, October 23, 2010 (UTC)

@Tsavi, that would be really really ugly. They both look alright individually as they both represent two different styles - one is the classic square borders + splatter background we are all used to. The other is a rounded border and subtle delination with clear titles. Putting the two together would be like eating a peanut butter and mayo sandwich. -- tierrie talk contr 03:36, October 24, 2010 (UTC)

While I've switched back to the old skin already, if I were to switch to the new one, I'll vote for number 2. It looks more....'dragon-agey'...if you know what I mean. IP no. 59.95.169.10 (talk) 17:47, October 23, 2010 (UTC)

Heh, it sounds like you are very much attached to the old skin and color scheme. Unfortunately, Wikia will soon remove that option. This gives us a unique opportunity to revamp our theme towards Dragon Age 2 and away from the original old DAO splatter. But I appreciate the feedback and it's nice to know that someone likes the old skin too :) -- tierrie talk contr 18:31, October 23, 2010 (UTC)

I like No2 with the red heading bars, draws ones attention to each section. No. 3 is good as well each section is blocked in. Maybe a combination would be nice. The red heading within the boxed; The red to get ones attention and the box for focusing the information. —Preceding unsigned comment added by Wanted49 (talk • contribs)

This is in regards to Portal:Mockup. Since the article space uses a lower opacity (with gradient) to make the background appear, it is harder to distinguish each box. In that case, borders should probably be added. I think the headings should be a different color. I suppose this may change in regards to the background image/color scheme. --D. (talk · contr) 19:15, October 24, 2010 (UTC)

@D-day, I pushed through the changes because I was getting a little too many "where is my navbar" requests. This doesn't mean that the front page is done. This would be a first-draft. The concept is there, and this is pretty much how it is going to look. Now we can work on the details.

What color did you think the titles should be? And what font should I use for the quotes? I added a black border shadow to the sections which makes it easier to see. Does that address most people's concerns? -- tierrie talk contr 02:36, October 25, 2010 (UTC)

My suggestion was mostly in regards to Wnated49's comment so that the headings would pop out a bit more than the previous color. The only color I had in mind was the kind of red you have chosen.

Since you've changed the arrows for the sliders, you probably want to do the same for the featured media's (.wikia-slideshow-sprite [1]). There's one small bug regarding the buttons (not for Firefox); only the arrows itself are shown, not the square/buttons in background.

One small thing regarding the slider; would it possible to actually not make the box reappear/disappear when it's showing, i.e. the loaded pages are only text, the box itself is on the mainpage or something?

For the quotes, I don't think it really needs to be changed. I would have tried with Georgia since that's the font used for the tooltip, but I don't have it installed (probably accidentally deleted it), so I can't see how it would look.

I really like the changes you've made for the main page, I think it looks great. :] --D. (talk · contr) 21:39, October 26, 2010 (UTC)

Thanks D-day! That means a lot. I did eventually change the heading to red because the tan was not within our color scheme. Plus, I wasn't particularly attached to one or another format.

I'm leary of changing the media's sprite right now - my arrows are not images, they are > and < in a <div> tag with some pretty style. So if I were to change the media I would have to override quite a lot of their code. Plus, I want to get the fav icon, and infobox changed first.

Speaking of the infobox, how's that going? I doubt you will get much more feedback and I'm alright with the changes. Do you want me to go ahead and modify the width?

Finally, you'll have to explain what you mean by "not make the box reappear/disappear". And before I do that, I'll explain how the slider works. It goes this way

                              [Portal:Component/Slider]
                                  transcludes:
                         [Portal:Component/Portal/Main]
                         [Portal:Component/Portal/Dragon Age: Origins]
                         [Portal:Component/Portal/Dragon Age 2]
                         [Portal:Component/Portal/Dragon Age]
                         (Main is shown immediately and is what people see, the rest are always hidden by default)
                                      |
                                      |
                            when a button (portal) is clicked on Main
                                      |
                              is javascript loaded?
                                      |
                 -------------------------------------------------
                 |                                               |
                yes                                              no
                 |                                               |
          hide Main, show other tab                   go to [Portal:Dragon Age]               <-- these pages are transclude [Dragon Age Wiki] and replaces
                                                     or [Portal:Dragon Age: Origins]              Portal:Component/Slider with the static version of the portal
                                                     or [Portal:Dragon Age 2]
                                                     

so when you say, "not make the box reappear/disappear" are you referring to the Slider transition between tabs? -- tierrie talk contr 00:59, October 27, 2010 (UTC)

For the infobox, I haven't had time to work on them since I've been busy (still am, will be) with college. :I I'll be making the templates for each box and will eventually update them, since the structure is different. The base template needs to have lower protection, and there's some CSS that will need to be added so that nested infoboxes work.

For the featured media, you don't have to override their code, you can just make the sprite that I linked by fitting the buttons/arrows on it.

Yes, when I meant boxes disappearing, it's the transition between tabs. I don't know if that would mess up the layout if you include the box in Template:Portal/Component/Slider rather than on every page that is being loaded in the slider. This will not make the box "blink". --D. (talk · contr) 21:16, October 27, 2010 (UTC)

I considered it but there's an consistency tradeoff required to make that happen. I will think about it. -- tierrie talk contr 02:05, October 28, 2010 (UTC)

Fixed it! I added a new template for {{PortalTransformer}} to transformer to, moved the old one from {{PortalBox}} to {{PortalSection}} to imply a section delineation and called the new one {{PortalPage}} to imply pages of portals. Or, as I like to call it, Magic. -- tierrie talk contr 01:13, October 29, 2010 (UTC)

There a reason the picture links are a full page scroll down now? --Tsavi (talk) 01:37, October 29, 2010 (UTC)

Hit shift-refresh. I inadvertently introduced that bug for 30 minutes while I was working on the page yesterday. I fixed it but the servers decided to cache that version of the stylesheet. -- tierrie talk contr 02:41, October 29, 2010 (UTC)

Ok, for a bit I thought I was getting the oddest bugs. :D --Tsavi (talk) 02:54, October 29, 2010 (UTC)