After years with no website...

shifty_uk · 13 May 2010 at 13:46

I have decided to consider building and uploading a new one :eek:

Partly because I wish to look for placements but also to showcase a lot of work people haven't seen.

Anyway, here's a first draft.

Honest, no BS assessments of the website and the displayed work would be absolutely fantastic! It's incredibly minimal and not much work shown but you get the picture

Final: http://www.ryanfindlay.co.uk

shifty_uk · 13 May 2010 at 13:57

Thanks very much for the suggestion

I completely get what you're saying, it does lack identity. In trying to make it as minimal as possible I completely disregarded that.

edit: Could you expand on the one page layout idea?

Tripnologist · 13 May 2010 at 14:09

He means to have a single page and then show/hide content as the user clicks on the nav.
For example,

- Have a div for each section on your homepage with an ID and then a generic class.
- Hide all the divs except for home with jquery. (This is so people with js disabled will still see all the content)
- When user clicks on a nav item, target the generic class:visible and fade it out, then fade in the div which corresponds to the nav item selected.

Edit: I'd also hide the nav by default and then use jquery to show it.. as anyone with js disabled wouldn't need it.

Spooter · 13 May 2010 at 14:16

I like it, maybe more detail on the opening page.

Maybe something that blends in once the mouse is moved? Like google do? The page loads looking minimul then you move the mouse and the menus drop in, but in your case it could be content...?

Very talented though with the paintings

shifty_uk · 13 May 2010 at 14:36

Thanks guys. I like the ideas, especially the single page layout. I see a lot of designers using the cargo collective system so wanted to differentiate slightly from that and I've no experience whatsoever with JQuery?

Tripnologist · 13 May 2010 at 14:49

shifty_uk said:
I've no experience whatsoever with JQuery?

If you already know css/html, it's really easy to learn the basics of jquery. Once you have the basics down, it's not too hard to dip into more complex stuff as there are a lot of resources out there.

http://docs.jquery.com/Tutorials:Getting_Started_with_jQuery

I just typed this up quick and haven't tested it but it should work.

Code:

<ul id="mainNav">
     <li><a href="Home" class="home">Home</a></li>
     <li><a href="Information" class="info">Information</a></li>
     <li><a href="Design" class="design">Design</a></li>
     <li><a href="Paintings" class="paintings">Paintings</a></li>
     <li><a href="Sketchbook" class="sketch">Sketchbook</a></li>
</ul>

<div id="panels">
     <div class="home">This is the home panel</div>
     <div class="info">This is the info panel</div>
     <div class="design">This is the design panel</div>
     <div class="paintings">This is the paintings panel</div>
     <div class="sketch">This is the sketch panel</div>
</div>

Code:

$(document).ready(function(){
	$('#panels div').hide(); //hide all panels
	$('#panels .home').show(); // show home panel
	$('ul#mainNav li a').click(function(e) {
		e.preventDefault(); // prevent default 'a' function
		var selected = $(this).attr('class') // find the class of the clicked nav item
		$('#panels div:visible').fadeOut(); // fade out any visible panels
		$('#panels .'+selected).fadeIn(); // fade in the panel who's class matches the class of the nav item clicked
	});	
});

UncleRuckus · 13 May 2010 at 15:51

I gotta say shifty I love the painting of the knight, man I wish I had some dosh, I would buy it off you.

shifty_uk · 13 May 2010 at 17:17

Awesome stuff Tripnologist, many thanks for even taking the time to write that. I've been doing a bit of reading after your earlier mentions of jquery but I'll definitely try and implement your script into the site for testing.

UncleRuckus said:
I gotta say shifty I love the painting of the knight, man I wish I had some dosh, I would buy it off you.

The knight is completely digital - I have the original high res version of it, if that would be any use(free of course)?

and thanks, it's quite epic hearing someone would actually pay money for my work.

UncleRuckus · 13 May 2010 at 18:36

shifty_uk said:
Awesome stuff Tripnologist, many thanks for even taking the time to write that. I've been doing a bit of reading after your earlier mentions of jquery but I'll definitely try and implement your script into the site for testing.

The knight is completely digital - I have the original high res version of it, if that would be any use(free of course)? and thanks, it's quite epic hearing someone would actually pay money for my work.

Thank you VERY MUCH! I will pm you my email, anyone who asks I will point them to your website.

Edit: can't seem to send a pm , my email is luke des 21 at hotmail dot com , you know the pic I mean right the one in sketchbook with the red feather coming out the back of the helm.

Again thank you very much!

Luke

shifty_uk · 13 May 2010 at 19:28

I shall dig it out my external HD and send you a link to it later

I have just updated using the script provided by Tripnologist. Thanks a bunch, it makes the markup so much easier to manage!

Sherbs · 13 May 2010 at 19:37

My personal opinion is as your work is good, you don't actually need an amazing site.

I think it works quite well.

I don't think you'd have much trouble getting into an agency

shifty_uk · 13 May 2010 at 20:17

Thanks for the kind words Sherbert and everyone else

So, reckon it's decent enough to good live/public?

Sherbs · 13 May 2010 at 20:37

Tripnologist · 13 May 2010 at 21:57

Nice, glad it worked for you.

With the fading in/out, you can adjust the speed of the fade to get it looking a bit better. I notice one of the pages skips a bit.
Or, you could string them together so it doesn't fade a section in before the current section is faded out.

http://api.jquery.com/fadeIn/

shifty_uk · 14 May 2010 at 16:08

UncleRuckus said:
Thank you VERY MUCH! I will pm you my email, anyone who asks I will point them to your website.

Edit: can't seem to send a pm , my email is luke des 21 at hotmail dot com , you know the pic I mean right the one in sketchbook with the red feather coming out the back of the helm.

Again thank you very much!

Luke

Sent

shifty_uk · 14 May 2010 at 16:47

Tripnologist said:
Nice, glad it worked for you.

With the fading in/out, you can adjust the speed of the fade to get it looking a bit better. I notice one of the pages skips a bit.
Or, you could string them together so it doesn't fade a section in before the current section is faded out.

http://api.jquery.com/fadeIn/

Thanks again! I ended up adjusting the speed slightly. I'll continue to dabble with jquery though, definitely some cool effects I could add.

.one. · 14 May 2010 at 23:36

I take it your still working on the site because at the moment it seems to have a bug ie: not working correctly.

shifty_uk · 14 May 2010 at 23:55

I will continually be working on it, yes but what's wrong with it? Works fine on Safari, FF and IE. You'll find an updated version on my homepage.