Design and Layout Mock-ups...

Post Reply
User avatar
Zarxrax
Joined: Sun Apr 01, 2001 6:37 pm
Location: North Cackalacky
Contact:
Org Profile

Re: Design and Layout Mock-ups...

Post by Zarxrax » Fri Nov 26, 2010 7:53 pm

This is just a very rough mockup, because I'm too lazy to put real effort into it.
The box beside the subscribe button is a popup, its only displayed when you click there.
The downloads section should probably be completely redone, but I didn't feel like it.

Image

User avatar
godix
a disturbed member
Joined: Sat Aug 03, 2002 12:13 am
Org Profile

Re: Design and Layout Mock-ups...

Post by godix » Fri Nov 26, 2010 8:45 pm

If the org redesigns and there are not videos of some sort or another put on the front page, then the thing is just a total waste of time. People come here to see videos. Looking at the mockup, there is nothing on it that tells a casual viewer we actually have dick all to do with videos. Which makes the mockup worse than the current layout, at least Doki put highly rated videos on the FP for those who aren't logged in. The site is about AMVs, the front page should be too. As such, I suggest the following mockup. It's ugly as fuck, but at least you can tell the site actually has something to do with videos:

Image
Image

User avatar
Nya-chan Production
The :< point of view
Joined: Wed Nov 15, 2006 11:21 am
Status: White bracelet
Location: Ward 7F
Contact:
Org Profile

Re: Design and Layout Mock-ups...

Post by Nya-chan Production » Fri Nov 26, 2010 8:54 pm

godix wrote:If the org redesigns and there are not videos of some sort or another put on the front page, then the thing is just a total waste of time. People come here to see videos. Looking at the mockup, there is nothing on it that tells a casual viewer we actually have dick all to do with videos. Which makes the mockup worse than the current layout, at least Doki put highly rated videos on the FP for those who aren't logged in. The site is about AMVs, the front page should be too. As such, I suggest the following mockup. It's ugly as fuck, but at least you can tell the site actually has something to do with videos:

Quoted Image converted to link:
http://img715.imageshack.us/img715/641/mockupr.png
I envy your rebuilding skills :>
Image

User avatar
Phantasmagoriat
Joined: Mon Feb 06, 2006 11:26 pm
Status: ☁SteamPunked≈☂
Contact:
Org Profile

Re: Design and Layout Mock-ups...

Post by Phantasmagoriat » Fri Nov 26, 2010 9:25 pm

Alright, I got DropBox to work as a hosting solution. So far it's pretty awesome, and I got the extra 250MB's thanks to Corran's referral link above. Check my first post for updates to my mock-up.

@Corran: I did not think about mobile users. Some sites have a mobile version of their site stripped-down to the basics, and the org could probably do that. Although the 3-column-style is starting to grow on me again, depending on what goes there, and if menus can be turned on/off.

@Zarxrax: Subscriptions on the VideoPages would be genius

@godix: you know, I always thought previews should be on the Members Page. I'll try to update my mock-up.
Oh, and banners can reload every time a new video is played! That'd be effing sweet 8-)
Nya-chan Production wrote:
godix wrote:If the org redesigns and there are not videos of some sort or another put on the front page, then the thing is just a total waste of time. People come here to see videos. Looking at the mockup, there is nothing on it that tells a casual viewer we actually have dick all to do with videos. Which makes the mockup worse than the current layout, at least Doki put highly rated videos on the FP for those who aren't logged in. The site is about AMVs, the front page should be too. As such, I suggest the following mockup. It's ugly as fuck, but at least you can tell the site actually has something to do with videos:

Quoted Image converted to link:
http://img715.imageshack.us/img715/641/mockupr.png
I envy your rebuilding skills :>
iknowhey
Image
Org Profile | AMVGuide | Phan Picks! | THE424SHOW | YouTube | "Painkiller"

"Effort to Understand; Effort to be Understood; to See through Different Eyes."

User avatar
Phantasmagoriat
Joined: Mon Feb 06, 2006 11:26 pm
Status: ☁SteamPunked≈☂
Contact:
Org Profile

Re: Design and Layout Mock-ups...

Post by Phantasmagoriat » Thu Dec 02, 2010 3:59 pm

Major updates to my mock-up here:
http://dl.dropbox.com/u/15771457/ReDesi ... nPage.html

Changes this version:
-Added Preview Panel & Current Playlist for easier viewing and user feedback (if you didn't know, the org always had playlist capabilities. We might as well make use of it :amv: )
-By default, the playlist could be made up of featured AMVs on the site (like Spotlight)
-Preview Panel uses a 'bento' style layout lol. It might look intimidating at first, but I think it makes sense.
-Ideally, the surrounding AMV information would change based on the video being played, but IDK how to do that using the playlist scheme currently used by the org... I know the player is skinnable, so if all video information could be integrated into the skin, that'd be a dream come true... (I'm sure it's possible with a separate playlist scheme though.)
-I think "Add to Playlist" can be added next to all search results so you can build your playlist on-the-fly
-Preview uses size of 480x360 to retain cinematic feel of widescreen vids, and for quality concerns when blownup
-Added Thumbnails/Screenshots of AMV
-Page Width increased to 960px and Statistics added to extra space in the banner
-Quicksearch: added Drop-Down menu/Browse/Tags so users can narrow searches immediately
--The Browse button lets you browse a category if the search field is left blank
--(check out some of my suggested categories too)
--The Tag button returns all tags associated with your search query (if the org decides to use tags)
-Added "Browse Tag Cloud" to Search menu
-Added "Browse by Category" to Search menu
-made side-menus exclusive to the second half of the page to free space for the preview panel
-Added link to hypothetical survey in the "latest poll.." side-menu
-I also started playing with colors/textures/gradients just for the hell of it... (keep in mind some things won't work in IE like rounded corners-- but everything should work in firefox)

I think a big improvement for the org would be to introduce a real preview interface; because right now we don't really have one. You just go from video page to video page with too much down-time between AMVs. Using playlists like the one in my mock-up might help. Just queue up a bunch of recommended amvs and away you go. Or queue up everything made by a particular editor, or someones entire favorite AMV list, or even a full contest. Save lists, Share lists, Add to lists, whatever. When the list starts, you don't even have to click anything-- just let the playlist do all the work for you.
Image
Org Profile | AMVGuide | Phan Picks! | THE424SHOW | YouTube | "Painkiller"

"Effort to Understand; Effort to be Understood; to See through Different Eyes."

User avatar
CodeZTM
Spin Me Round
Joined: Fri Mar 03, 2006 6:13 pm
Status: Flapping Lips
Location: Arkansas
Contact:
Org Profile

Re: Design and Layout Mock-ups...

Post by CodeZTM » Thu Dec 02, 2010 4:08 pm

Phantasmagoriat wrote:Major updates to my mock-up here:
http://dl.dropbox.com/u/15771457/ReDesi ... nPage.html
I absolutely love this mockup!

My only real "bug" about it is the screenshot screen on the left side. I think it'd be better to have a larger video screen/rleatedvideos area and have screen shots moved to a text link instead with a pop up message box to scroll through at our leisure.

Also maybe [for non-donators] a big red/orange/whatever donate button somewhere to more actively show that we need/love donations. Something that nobody can miss and link it to a page listing all donator benefits.

User avatar
mirkosp
The Absolute Mudman
Joined: Mon Apr 24, 2006 6:24 am
Status: (」・ワ・)」(⊃・ワ・)⊃
Location: Gallarate (VA), Italy
Contact:
Org Profile

Re: Design and Layout Mock-ups...

Post by mirkosp » Thu Dec 02, 2010 4:25 pm

The real bug that I found is that the dropdown menus on the top are hidden behind the flash video preview... :uhoh:
Image

User avatar
Phantasmagoriat
Joined: Mon Feb 06, 2006 11:26 pm
Status: ☁SteamPunked≈☂
Contact:
Org Profile

Re: Design and Layout Mock-ups...

Post by Phantasmagoriat » Thu Dec 02, 2010 4:30 pm

CodeZTM wrote:
Phantasmagoriat wrote:Major updates to my mock-up here:
http://dl.dropbox.com/u/15771457/ReDesi ... nPage.html
I absolutely love this mockup!
Thanks :)
My only real "bug" about it is the screenshot screen on the left side. I think it'd be better to have a larger video screen/rleatedvideos area and have screen shots moved to a text link instead with a pop up message box to scroll through at our leisure.
I know what you mean, yet I think screenshots should be on the page because "a picture says a thousand words etc..." type thing. Ideally, if an image could show in the preview window, I would move the screenshots to text links like you suggest. Although a larger preview window may lead to quality issues in high-motion AMVs.
Also maybe [for non-donators] a big red/orange/whatever donate button somewhere to more actively show that we need/love donations. Something that nobody can miss and link it to a page listing all donator benefits.
IMO, a donate link next to the logout button is good enough, without being too intrusive.

mirkosp wrote:The real bug that I found is that the dropdown menus on the top are hidden behind the flash video preview... :uhoh:
If the real coders decide to use a dropdown menu, I'm sure they'll find a way around that :sweat: . What browser?
Image
Org Profile | AMVGuide | Phan Picks! | THE424SHOW | YouTube | "Painkiller"

"Effort to Understand; Effort to be Understood; to See through Different Eyes."

User avatar
mirkosp
The Absolute Mudman
Joined: Mon Apr 24, 2006 6:24 am
Status: (」・ワ・)」(⊃・ワ・)⊃
Location: Gallarate (VA), Italy
Contact:
Org Profile

Re: Design and Layout Mock-ups...

Post by mirkosp » Thu Dec 02, 2010 4:31 pm

Phantasmagoriat wrote:
mirkosp wrote:The real bug that I found is that the dropdown menus on the top are hidden behind the flash video preview... :uhoh:
If the real coders decide to use a dropdown menu, I'm sure they'll find a way around that :sweat: . What browser?
Chrome. But I'm one of the people that doesn't like dropdown menus (I keep slipping the mouse pointer out of it, it gets annoying! >_<), so another menu design choice would be more fitting for my taste to be honest. :uhoh:
Image

User avatar
Phantasmagoriat
Joined: Mon Feb 06, 2006 11:26 pm
Status: ☁SteamPunked≈☂
Contact:
Org Profile

Re: Design and Layout Mock-ups...

Post by Phantasmagoriat » Thu Dec 02, 2010 4:35 pm

mirkosp wrote:
Phantasmagoriat wrote:
mirkosp wrote:The real bug that I found is that the dropdown menus on the top are hidden behind the flash video preview... :uhoh:
If the real coders decide to use a dropdown menu, I'm sure they'll find a way around that :sweat: . What browser?
Chrome. But I'm one of the people that doesn't like dropdown menus (I keep slipping the mouse pointer out of it, it gets annoying! >_<), so another menu design choice would be more fitting for my taste to be honest. :uhoh:
like what?
Image
Org Profile | AMVGuide | Phan Picks! | THE424SHOW | YouTube | "Painkiller"

"Effort to Understand; Effort to be Understood; to See through Different Eyes."

Post Reply

Return to “Org Redesign”