PDA

View Full Version : digitalcarnival.com



evildrummer
June 16th, 2007, 06:47 AM
Well I decided to go for a new look and so I have coded this, this very morning. I decided to re-use alot of code from some old projects and so was uber quick to make.

What do you think so far:

http://www.digitalcarnival.com

EDIT// If any mod happens to pass on by could they change thread title to spell digitalcarnival.com ( I missed the 'i')

MAJOR UPDATE: I've completely changed content format, and it is now all spiced up with AJAX!

doctor_funk
June 16th, 2007, 09:32 AM
Hey, that's neat stuff! Ajax?

Esherido
June 16th, 2007, 09:53 AM
Nice use of Accordion, but the overall design seems lacking.

evildrummer
June 16th, 2007, 10:05 AM
There is some AJAX there but what do you men by lacking design?

Fl4SH'ER
June 16th, 2007, 10:13 AM
I'm not a fan of blue nor cyan but it looks quite nice.
Few things that could be improved.

1) Remove or change that black arrow on the splash page ( it stands out way too much and it's way too big ).
2) On the left, where you have that graphic ( on the main site ), try making it Illustrator or recreate it in photoshop but at a higher resolution. It looks blurry and it's quality is quite bad.
3) Add some padding to your text...
4) I don't know why, but i think a white border/margin would pump the layout a bit.

Good Luck and keep us up to date. ;)

Jeff Wheeler
June 16th, 2007, 10:13 AM
Reminded me instantly of http://moofx.mad4milk.net/, without a design. Just look at the contact page -- there's no style at all.

Oh, and if that's all the JS you have, then you're importing way too much JS and wasting my memory. :P

Phenex
June 16th, 2007, 10:28 AM
margin and padding dude. Seriously! It's waay too rough right now.

And that bg you've used for the actual interface, it's uhh... well... distorted. Use a higher res image man.

Nice working with the whole "hob" functionality but I think, better content and better colors is what is needed more.

It's a very solid start though. Keep it up and ALL the bestage! :thumb2:

evildrummer
June 16th, 2007, 10:45 AM
Ok so far my to do list:

1) Make higher res background (After creating the original I lost the .psd so just scaled the small .jpg from the header)
2) Scale down the JS (I have some quite abit of code from some other projects that I dont need)
3) Add padding on content
4) Make it alot more different to the link nokrev posted
5) Edit front splash page to remove focus from arrow
6) Add some more styling to contact page (Although you may/may not have noticed it has styling for validation)
7) Replace the cruddy content I wrote with some better clearer and easier to read stuff

EDIT// Just actually looked at nokrevs link, and it mine does look similar but I see alot of differences

and @ Fl4sh'er, what do you mean by white margin, as in around the central column?

Fl4SH'ER
June 16th, 2007, 10:48 AM
Yeah, I mean add a border to the main div or table ( didn't take a look at what you are using ). Something like here http://moofx.mad4milk.net/ ; they have a transparent green border....

Jeff Wheeler
June 16th, 2007, 11:14 AM
I almost called it a rip. :-/

It feels pretty much the exact same.

Fl4SH'ER
June 16th, 2007, 11:20 AM
^ shhh, don't be rude... :ponder:

Jeff Wheeler
June 16th, 2007, 11:30 AM
Apologies. :(

Love your arrogance-o-meter in your footer!

evildrummer
June 16th, 2007, 11:43 AM
using an accordian is hardly a rip but if you think its too similar I will start again.

Phenex
June 16th, 2007, 11:47 AM
^ To be really honest there ED, an static, good looking, centered design would look and work far better than the whole "hob"/"accordion" thing. Trust me. When the content amount goes up, those fancy little things seem to fail. I'm not trying to discourage you or anything. Just a point about what I feel.

evildrummer
June 16th, 2007, 11:52 AM
^ I've had problems with mootools accordians before, but I might amke two versions, as the CSS isn't too hard to change to turn it from an accordian to a plain complete column,

hybrid101
June 16th, 2007, 12:04 PM
modern browser:lol:
not bad, bg is blurry though. and too many colors with the content boxes too bland:(
could do better dude;)

duncanhall
June 16th, 2007, 12:05 PM
I think it feels a little weird at the moment because you haven't got all your content up, so the ajax nav is even more over-powering in the general scheme of things. This will obviously get better as you fill the site up, but I also agree the content style needs touching up a bit. Nothing too much, but definately some padding and maybe a little colour.

Also, a thought I've just had - how about making the content area a fixed height? So the accordian still works pretty much the same, but instead of resizing, the content area remains at a constant size, and the accordian headers would move to the top or bottom of the area as required. I'm not sure how much fiddling this would take, but I'd like to see how it looked.

Also, I'm not a big fan of the green used for the selected header background. It feels far too washed out. Try experimenting, maybe with something really bright, and adjust the text colour accordingly.

I think it's a good start.

evildrummer
June 16th, 2007, 12:11 PM
well I've had a new idea but it would take ALOT of javascript so if anyone thinks its good say 'ay' and I will code it tomorow. So my idea is such

1. there is only two bars, one above the content and one below.
2. There is menu next to or below header
3. When a menu item is selected the bottom bar slides up and so old content is hidden.
4. AJAX retrieves data and puts it into hiddent content div
5. bottom bar slides back down revealing new content.

Thinking about it now, I doubt it would be too hard to do with this layout. I wouldnt have to change any core parts of CSS and I can just get rid of the heavy mootools in favour of the much lighter script.aculo.us

duncanhall
June 16th, 2007, 12:19 PM
Yeah, that's pretty much what I was trying to get at. Go for it.

evildrummer
June 16th, 2007, 12:21 PM
All right, I think I can get a draft done in an hour, i'll post then

evildrummer
June 16th, 2007, 04:57 PM
Ok, so here is a MASSIVE UPDATE:
http://www.digitalcarnival.com

1. i got rid of the accordian
2. I created a cool AJAX sliding system (there will be bugs please let me no)
3. Isn't the new AJAX system enough?

New to-do list:

1.Optimise images
2. optimise JS
3. Create more content styling (its a bit plain)
4. Please give suggestions!

EDIT:// And if people could say how quickly or slowly it loaded taht would be good because on my machine it takes AGES but my PC sucks!

Fl4SH'ER
June 16th, 2007, 05:02 PM
Still needs padding and it's a bit weird because the bottom black line does not go all the way down... I'm on a higher rez right now and I can see a huge "blank" gray area under the black bar... And maybe try another font. ;)

evildrummer
June 16th, 2007, 05:11 PM
I'm testing on a 1280x1024, what are you using?

and yeah padding needs work, but what do you think of slides and AJAX?

EDIT// and which black bar, two slide down :look:.

Fl4SH'ER
June 16th, 2007, 05:49 PM
^ the bottom black bar... The last one... I have no idea what rez are these morons using... I'm in a net caffee... :D I do not have access to all that crap...

EDIT: Hmm, it seems that you fixed the bog or it was a browser bug... Now the bottom black line is in the right place.. :) I was reffering to the one that is "stuck" to the bottom of the browser... I found a sliding problem... Try clicking on a button and after that fast, on another button... The code kinda dies and it won't slide anymore.... ;)

evildrummer
June 16th, 2007, 06:04 PM
^ I guessed which one you meant and fixed it,

about the bug for those with quick fingers, I don't have time to actually fix it but I have thought of a way to stop most of it.

Ive beefed up the padding and will start styling the menu and text tomorow

Jeff Wheeler
June 16th, 2007, 06:54 PM
With Javascript, it isn't smooth at all, and it feels like it's just JS for the point of JS. Without Javascript, I can't navigate the site.

Templarian
June 16th, 2007, 06:59 PM
<a href="#" onclick="changeContent('home');">Home</a>

Should be:

<a href="javascript:changeContent('home');">Home</a>

Jeff Wheeler
June 16th, 2007, 07:11 PM
No, it should be <a href="/" title="Return home">Home</a>, with the JS click handler added dynamically on page load if needed.

evildrummer
June 17th, 2007, 05:29 AM
^ Stop being so picky :tb:

And its not JS for the point of it, its just a way of changing the content, how else would you like it?

It also shows that I can use Javascript and AJAX + I know that the people im doing work experience with are AJAX fanatics! :rambo:

Anyway, I actually think its a good way of displaying content, + its way more interesting then static stuff.

Phenex
June 17th, 2007, 07:03 AM
Sorry to break your heart, but the AJAX is super buggy.

Here's what all I tried and how I tried to mess it up (just to test ofcourse):

- First I clicked on each link sequentially. The slider worked fine except for a tiny bug. When the slider starts to open and when it reaches finality (when it fully opens or fully closes), there is a sudden jerk in the motion which is very apparent.

- After that, I tried clicking on a random link and the slider did not work at all and then after a second or two this is what I got:

http://img216.imageshack.us/img216/9651/dcsskr2.th.jpg (http://img216.imageshack.us/my.php?image=dcsskr2.jpg)

After this happened, ALL your links act the same way.

- Instead of blue links in your header for "Portfolio", "Contact" etc. you should use nifty little images with anti-aliased text in them written in a good contrasting color.

- The text size for the content is a little too big as it is. Make it smaller. It will look better for sure.

- The page bg is still distorted.

These are the major things which I could notice in an instant. Other than that, I dunno. I'll need to try out more.

evildrummer
June 17th, 2007, 09:44 AM
Here's a much cleaner, more efficient, smoother and different aproach to it:

http://digitalcarnival.com/clean.html

Fl4SH'ER
June 17th, 2007, 09:51 AM
Much better then the previous one but I'm still not feeling the font and that graphic in the upper right corner... Add just a tiny amount of detail to the whole design, not to complicate it, just to spice it up a bit...

Phenex
June 17th, 2007, 10:30 AM
Here's a much cleaner, more efficient, smoother and different aproach to it:

http://digitalcarnival.com/clean.html

Dude, seriously, that thing still has bugs for the naughty ones like me. Try clicking on two links one after the other in rapid succession. :lol:

Keep it up. It WILL work. Once set, start working on the design part. :thumb2:

Jeff Wheeler
June 17th, 2007, 10:50 AM
Still buggy for me, too. It's not smooth. :-/

Phenex
June 17th, 2007, 12:00 PM
^ Ditto'd :(

evildrummer
June 17th, 2007, 01:25 PM
What browser and OS are you guys using? For me on Win XP Flock (Gecko) It runs fine. well part from the buggy double click!

Jeff Wheeler
June 17th, 2007, 01:30 PM
Gecko on Debian.

Fl4SH'ER
June 17th, 2007, 01:30 PM
<3 FF on Win XP SP2. :pleased:

BlueEyedMonster
June 17th, 2007, 01:40 PM
ff on vista looks like this http://i12.tinypic.com/66vhzci.jpg

ie 7 on vista http://i16.tinypic.com/63bl8ap.jpg

Maybe you should use the functionality for a gallery of your work or something, not the main nav. It's just too buggy. IMO it is not cool enough of a functionality to compensate for the buggyness. Spend more time on the layout. :m2:

Phenex
June 17th, 2007, 01:43 PM
Windows XP SP2

FF 2.0.0.4
IE6
Opera 9.2
Flock

evildrummer
June 17th, 2007, 01:56 PM
Im sorting out some functions so as the content is sliding the buttons are disabled, that way you dont get all the bugs!

evildrummer
June 17th, 2007, 02:13 PM
UPDATED!!!
http://www.digitalcarnival.com/clean.html

Changes:
1. Fixed bug for those impatient
2. Added a loading symbol so people know something is happening

To do:
1. Spice it up
2. Make it smoother
3. Make it lighter

Fl4SH'ER
June 17th, 2007, 02:18 PM
A tiny bug, when you click on the portfolio button... The black bar goes a bit way too down and suddenly jumps back to the position it should stop initially ( same thing when you click another button after this, just reverse )...

evildrummer
June 17th, 2007, 02:25 PM
A tiny bug, when you click on the portfolio button... The black bar goes a bit way too down and suddenly jumps back to the position it should stop initially ( same thing when you click another button after this, just reverse )...
That will be gone soon, its because when I edited the effect javascript I set up a slight ease but it runs the setup for the ease (which makes it go down) before detecting the stop point which for the portfolio page is behind wgere its gone.

So in short: When theres more content it will be gone!

Fl4SH'ER
June 17th, 2007, 02:29 PM
^ Aha, gotcha... ;)

evildrummer
June 17th, 2007, 02:51 PM
^ Made some more content for portfolio section,

Also lightened up the JS

What's next? I'm guessing I will have to make the design more interesting!

Fl4SH'ER
June 17th, 2007, 02:57 PM
Ok, so the portfolio section works now, except for the part when it rewinds... After clicking on another button and the whole thing closes, you can see that tiny jump ( it jumps down and goes up... I know, i'm picky, but I have a keen eye for detail... the same problem with the other button... try getting your text right so it will be much smoother... that little jump is gets quite annoying after clicking on more then 2 buttons ). I'm not sure about other bugs, let's just wait until Phoenix or nokrev replies ( they are using different browsers, I only have FF and IE )...

But meantime, yeah, you could start working on the design part... ;)

evildrummer
June 18th, 2007, 01:18 PM
Im starting to (should read 'attempting to') style the site now, if some people could say what they think it would be usefull!

jeffonfire
June 18th, 2007, 02:23 PM
Good job coding this. Get rid of the picture in the right corner.

evildrummer
June 18th, 2007, 02:33 PM
^ Changed to make it more subtle!

InfestedDemon
June 18th, 2007, 02:45 PM
Hey! Evilddrumemr! its been too long!
Well i've moved now! I'm jsut qabout ready for Project :: Zombies. That reminds me do i still have that section on you're site?

evildrummer
June 18th, 2007, 03:02 PM
Hey! Evilddrumemr! its been too long!
Well i've moved now! I'm jsut qabout ready for Project :: Zombies. That reminds me do i still have that section on you're site?
*Quickly Checks*, yeah you still have a sub-domain + FTP support, (Just PM me if you need details again) But just to let you know I dont know if I can carry on anytime soon, I have some GCSE exams and then over summer my work experience company might be giving more work to me :nerd:

InfestedDemon
June 18th, 2007, 04:04 PM
Yeah sure.
I'm gonna start it from scratch, but this time the 360 is right next to the PC so we COULD use visual c#. Lol. ~Its nice to be back.