Wednesday 23 February 2011

Research Assignment Multipost

Hi guys !
It's been a long long long time !
I've had this post saved as a draft for like MONTHS so there it is, for your eyes only :-)
So, what's new ?
Well there's been 2 new versions of the website online since last time.
Crazy, I KNOW, right !?




V.2.0
The 1st 1 featuring a full visual layout !
v.2.0 permalink

So that was alright.
But still far from complete, and is used a mockup for the loading bar also ...



V.2.1
That's the current version so just go the website's homepage.
I don't think I'm gonna post a permalink but next time I post an update it will have a working archive and U'll B able 2 go check out how it used to look in that way ... maybe.
I'll work it out.
V.2.1 has a portfolio !
And that's it ...

Far from complete, work in progress, U kno the drill.
But yet again 1 step closer 2 some kind of finished product, so ... yay !



In the process of creating all that stuff, I used a couple of features in Flash I had never used before ... I did ! For example, I used scenes, which I experimented with in this silly exercise. Also, in the process of creating all that Flash material, I realized that, sometimes, Flash is just ... beautiful ... wooow ...
Lastly, I kinda wrapped my porftolio up in a couple of days but I was gonna do something a bit more in the style of Alex Cherry's website, which is very good so go check it out pplez.



Overshadowed by Gorillaz

I realized just how much Kong influenced not only the Haunted House but even my current website project the other day. I think I got the basic idea of sharing data and having a database-centered website from them, check out these screenshots :

The inventory has a quick link facility that lets you access each band member's personal computer at all times



Within the studio, each one is located in its owner's bedroom ... somewhere



And they let you view & sometimes download stuff ! Imaged-based content monstly but it's still what the basic concept is, it's where I got it from.
So yeah, Gorillaz ... what would I do without them :-)
Good inspiration in any case, many thanks !



Technology what's your fuckin' problem !?
I've been harassed by technology lately ... Laptop went berserk, I mentioned that, but then I also got some techies to recover data on an old hard drive that I thought I could have used (some of it) for research but it's not gonna happen 'cause it's all around the place (it got sorted by extension ... flippin' gr8). There was that problem with that USB that got wiped by the Macs as well, and that happened again but on my whole hard drive, not like I lost a lot but I don't like wasting my time or doing the same thing twice so FUCK YOU MACS !
There, I said it, I feel better now ...



What's up with the warning pattern ?
Well quite frankly I'm not too sure ! Thou the main idea of my website (aka overall layout of the homepage) has not changed since I drew the 1st concept last summer, it evolved and mutated a bit.
Now each page has a bit of that pattern and is developped around it, not just the homepage !
I think it adds something to it, it does not only denote danger, rather constant evolution and refining in this case, it's a work in progress, being built ... I think it works in this sense too ...

Anyways I've tried to track down the origins of this pattern and I got 2 possibilities :

-It could come from the website I did in Grade 10. It's been taken offline sadly but the homepage used to look like this (that's the French & English homepages put side to side to compare). I mainly built it from cool stuff (*what I used to find cool at the time, in 10th Grade, you all know what that would be :-D ... no you don't ? Ahm, yes you do -you asked for it !-) I found on Google back then and thou I do not know if I included this one pattern for sure, because I did not quite finish the whole website there were still quite a couple of pages left under construction with this dude and that dude on there, so that could be where it all started.

-It could also come from a project I did when I was working at the Nail Bar. They had very very horrid handmade signs, especially one on the front door (pretty bad) with the opening times, but also one on the toilet door that said "staff only". For the one on te front door, there was nothing to do, I redesigned it from scratch and I'm pretty sure it still stands sits there to this day 'cause it was pretty kick ass ! But thou the one on the toilet door was bad (felt tip pen fades over time ... expecially when it's pink) the typography was still quite cool so I just printed the warning pattern around it and then more or less copied the typography by hand inside of it. The idea was to let the customers understand that they should NOT use the loo in a way that makes it clear but that's not too authoritarian. I think it worked rather well. Anyways there's the pattern I came up with. It might just be where the idea originated ... but then it feels as thou I had it in my head way before that (it was in the Frankenpad). So I got no idea really ...



Online applications inventory
"How much Flash crap do I have online ?", you ask ?
Well, "Lots", I answer ...
Like that much:
Haunted House
v.1
v.2
v.3.1

Testers
UI Template
Children Experiment 1
Children Experiment 3
Children Experiment 6
AddChild Loop
Devil & Angel
Gif Tester
BooGhost

Exercises
1-Regular Tree
1-Red Tree
1-Colourful Tree

2-Domo

3-Random

Website
v.1.0 raw
v.1.0 HTML

v.0 raw
v.0 HTML

v.0.0 raw
v.0.0 HTML

v.1.1
v.0.1
v.1.2
v.2.0
v.2.1 (/most up to date)




DJ's roots
DJ right ? The main comic character who represents me back then I was a really frustrated teenager walking around High School with hugh headphones glued to my ears (unlike DJ I didn't have hooves or screenwiper-shaped eyes thou ... just so U kno), the dude in green at the top of this port. I started drawing him in High School in my then Artbook (G11-12). Matter of fact, this is the 1st comic in The Chronicles of DJ. Right anyways, so I started drawing him back then but I was mostly influenced by a blogger called Mad~Monkey. She was really cool, drawing a lot of Gorillaz fan art, and she had a blog but it was taken offline ! And then I lost her trail ... And now incredibly, in the frame of my research, I've found it back ! So behold the true dark (and kinda Emo, sorry in advance for that) origins of DJ : Bad blog 1 Mad blog 2 Mad blog 3 !



Sketchbook update
New sketchbook stuff ... yay ! There's a couple of things there, jsut check them out.
Page 1, Page 2, Page spread



Updated title graphics

Before
After

I KNOW, I wowzered in my trousers when I saw this too !
I'm glad we share the same feeling ... so touching !



Aaaand well that's it for today !
What ? Well why yes indeed, as it turns out, I got other stuff to do I shall get on with too !
Sooo I'll be in touch.
Soon.
... enough.

Take care peoplez :-) !

Friday 4 February 2011

WTF & Fixed

Wow !
So much stuff, so much emotion !
There's been quite a bit happening during this week :




-my PC crashed and is damaged, will have 2 get repaired by the Dell pple.
(it started acging weird on tuesday last week) It mostly slows me down for my other module. It's OK now 'cause I got the files but it's worrying me 'cause I mean, poor Neo :-( & I can't really work from home anymore 4 now AUUUUUUUGH !

-my USB got wiped and I almost lost all of this week's worth of data !
That was right today (on Thursday). Luckily somehow as it turns out I had backed up everything for this module on the Macs yesterday ... that was damn lucky ! So I only lost stuff that's irrelevant 2 this module ... phew !

-I found out that I'll only be able to have one webpage with FastHost (I bought my domain from them) until I decide to buy their webspace and pay monthly (as I'm using the Uni server 2 host stuff 4 now). FUCK THAT (for now anyways) ! So up until finances get sorted out a bit (like that's gonna happen lulz) I'll just work within the same Flash App insteadda redirecting to separate webpages, which is what I was planning on doing on the 1st place 4 the 1st draft anyways but then I'm not 2 sure if I still wanna use different webpages 4 the final ... I'll see.

-I finished stuff !
Old Placeholder page v.2 <<<permalink>>> (a bit bugged)
New Placeholder page <<permalink>>>
New Loading page mockup ! <<permalink>>>

So the current website that's online is the New Placeholder page ("Menu3"/"1stMockup_49"), next : the Homepage :-D

Also I been helping Sir Angrew with his pixel idea thingy (it's fair in a way 'cause his stuff insired me 2 use glow on the new Placeholder, & 4 what follows) and I stumbled upon that old friend :

Paul Robertson !

Genuis dude, working with pixels mainly, it's good inspiration for both my modules.
He's got a very very special style thou, so I warn U if U're gonna click the link, but real cool still in my opinion.
He works with a couple of friends and they have a couple of websites and things all over the place (it's a bit confusing to find what you're after, actually ... ), so there's a couple of inspiring thingies related to Paul Robertson I'm a link 2 now 'cause it might just inspire me in the future :

Interactive Flash App by Paul, pretty interesting codewise
 
Animation by Paul, involves murder

Animation by Paul, involves ... well you'll see !

MechaFetus homepage, nice simple design

MechaFetus blog, lots of ideas in there

Persona's blog, nice simple layout (buttons on left side)

PantsOnPete blog, nice title image

Except for PantsOnPete (he's a friend of the GreasyMoose) they're all Paul Robertson-related people.

Also last link, totally unrelated to all the above but Elena shared that awesome link earlier on ...
It's very awesome !
I just like how it's animated together, very simple yet super effective !
So ye ... enough links 4 2day !

I guess you could say that Paul Robertson & co's stuff is a bit disturbing, but I like it :-)
Because there's a lot of stuff on there and that it's not all relevant to this module I added the other links I had to a post on my other blog, check it out for more stuff on Paul Robertson.

Well bye for not and be back soon with more stuff, YAYZIES, ciao !

Tuesday 1 February 2011

My baby's beautiful :-D !

Hello !
And zOMG !
My website's online :-D !

Well not like it's finished obviously but I've got a neat little placeholder page that says "Coming soon" :-D
Go check it out !!! --- (Flash app permalink)

OK so I have 2 give credits 2 pplez on this 1 :

-1st of all the dear Sir Angrew who gave me the idea to put a placeholder page on the 1st place, check his out. Cheers pal !
-And then I stole some URL request code from here as well as some HTML alignment code from there, it was very useful ! That alignment was more of a challenge than I expected but I made it in the end :-D



Very good news, very good news indeed !
We skipped a step or 2 thou, also I said last time that I'd get onto the actual pages mockups next, but the design of the buttons took me a long time ! The ones presented on the website are the very finals with a little label ("HOME", "DESIGN", "ART", etc.) appearing under each icon when U mouse over it, there's a file with the very same icons w/o the labels, it lets U switch between a white & black background too.
I came up with everything myself, including the colours which were a big part of it, I chose each hue so each icon is clearly visible on both a white and a black background, I like the result.

Now if you can't get enough of that sweet icon creating process click the image below for the entire icon development process ...

That is all for today !

More exciting updates soon !

Ciao !

Tuesday 25 January 2011

Concepts continued

Hello hello !

So today I've scanned in the concepts for the remaining pages, which I did over the week-end ... let's have a look !

1st off there's the final Art page :
So there's that Art Gallery theme going on there with the classical frame and all.
It's a bit obvious but I came up with nothing better so it's probably just gonna stick :-D
There'll be cool details here & there thou, like the fact that there's a frame within the frame (the outer frame and the intro/info picture inner frame), that I'll integrate the page buttons inside of the inner frame and, most amazingly, I'm also planning on having some kind of "jungle up" button that changes the whole interface of the page.

Jungle = off > Rather straightforward gallery with an intro picture at the top.
Jungle = on > The outer frame shrink to fit closely around the inner frame, thus deleting the gallery, but characters from the gallery appear on the intro picture and become the new way to access the individual pictures from the gallery (just interact with them > click).

I'm actually rather excited about this one :-D
There's still quite a couple of things I have to figure out still, such as how to work out that gallery thing, but if I get it right I believe it could be a really classy & cool page :-)

Then there's the Design page :
That might get a bit tricky 'cause there's so much content to go in there (i.e.: the list at the top of the page) ...
It shall be an extra challenge.
In the meantime, in terms of layout, I'm just gonna use a clever trick : the ADOBE CREATIVE SUITE :-D ! That's damn right, I'm planning on using an InDesign CS3 mockup for the layout ... why not ?
I'll make it all my own (including changing the toolbars into link button panels) and I think it could look really good, + for the medium (the joke works exactly on the same level that the frame one does for the Art page ... clever, huh :-P).
It opens up possibilities also, like if I get crazy with my scripts I might add options to reorganize each main panel (a main panel = 1 module, e.g.: Flash/After Effects/etc.), like from oldest to newest chronologically or inverse, or to close separate panels. But I'm not there yet.
That's more like if I get bored and that. We'll see :-)

Also NEWS FLASH, Articles/Blog shall directly redirect to this blog, so I won't have to design any actual page for it ... we're down to 7, 3 left :-)

Then there's the Info page :
I think that one's pretty important 'cause it made me realize that, at the end of the day, only 4 of my pages needed to have a really individual personality :

-My Main page, 'cause it's the 1st thing you see and thus requires to be kick-ass @ 1st glance, it's rather straightforward
-My Music page, that shows my musical creations
-My Art page, that shows my paintings & stuff
-My Design page, that shows what I've been up to since last year up until now.

The other 3 (Info, Links & Sitemap) don't need to be that impressive, they don't need to show my creativity as much at the above 4 that directly present it.
They're rather information/text-oriented and should be more functional & less playful.
I've been admiring the GreasyMoose since I discovered Space Duck on Youtube and I also really like Cyriak, whom a friend introduced me to earlier this school year (not the dude himself, his stuff ... I wish thou !), they're 2 very important influences on me and when you look at them, their about/contact pages are nothing too fancy (the GreasyMoose @ about - Cyriak @ about - Cyriak @ contact), so I'll just follow their footsteps on this one for now if it's OK.

Anyways so then there's that rounded edge average page standard, the buttons at the top left, my smoking DJ on the left (just like on the main page, just slightly edited in the way you interact with him), lots of blabla about me and how cool I think I am, the page link buttons at the bottom on the left with explanations of what you should expect to find on each page, and finally my e-mail at the bottom right (thou I might put the other 1 there ... I'll see).
That's for the page, that should about cover it really, not so much more to put in there ... it should do the job pretty well, thou 2nd thought I might delete the links at the top ... I'll see.

On the picture you may have noticed that I came up with a wicked cool concept for the loading bar also, that utilizes the ball concept that pages shall evolve from and turn back into, awesome !
There's not much to it, blank screen, circle draws itself, bar appears in the middle of empty circle, 0% > 100% ~ the circle fills itself into a solid ball, the bar disappears leaving a full solid ball on screen.
And then it goes on to animate into the main page.
It should be good ! I'm looking forward to that :-) ...

And last but not least, we have the Links & Sitemap pages :
So these I also use a much more simple straightforward design.
There's not much to say about the Links page, I'll wanna have a rather long list, I got 13 Links in there 4 sure already, so I'll have to take that into consideration.
It's very much inspired by the GreasyMoose's links page.

And then out of all my pages the Sitemap page is the blandest, I think ...
But then also the simplest ... I hope ?
I'm planning on having some kind of domain map going on as well showing what's on peterwhyts.com (so Uni servers for now), what more or less belongs to me elsewhere (e.g.: blogs & that) & what's on the rest of the internet I link to, something that would look similar to what Ishkur did in his brilliant Guide to Electronic music.
That & a bit of MouseOver coding to display extra info & that should be pretty much it for the Sitemap.



So that's it for the concept !
Next up : 1st mockup ... let's do this !

In other news I decided to slightly change the icon system because 1- I wanted short & snappy words for each of them (e.g.: "Sitemap" becomes just "Map") & 2- I realized that the icon to Links (now "Giants", by the by) looked like the overall layout on Map ... confusing as hell ! So Giants & Map get a new icon.
You'll see !

Anyways that's way enough blabla for today, I'm a go and save the rest for later.
Ciao !

Friday 21 January 2011

Starting concepts

Hey there !
Today we're going over the starting concepts for my website layout !

It all started with that layout :
I drew this before the module started 'cause I bought the domain on which I'm gonna host my site last summer, it's the very core concept we're starting from.
"Simple", "bright", "colourful", "easy-to-access" and "cool no trespassing lines-type bands" spring to mind.
That hard-to-read thing written in pencil at the bottom left is a scribble of the evolution system used in the game Patapon 2. One of the concept I want to base my website on is that of an archive, that would let you view every version of the website that ever got put online at any time, and I wanna have a system of buttons organized like a tree much like that system. The buttons would toggle older versions of the flash interface displayed. More on this in the next image.

I then developed it into that baby :
Same basic concept and layout but I started thinking about what pages it should actually link to, the content of my website-to-be, how many buttons I should have on the right side, etc.
This is the final concept for the homepage as of yet, but it also made me realize that now, I have another 7 pages to design, as I want to give each one a personal identity, which would conform to the same homebrew overall style, linking them all together.
Notice the button system I mentioned at the bottom. Andrew advised to get into XML on this one, I'm rather dreading this part to be honest but I ordered a book on that so we shall see ...

So there's final concept as of yet for the 2nd page, the Music page :
I somehow came up with that cool hexagonal concept thing, got now idea how to be honest, but I wanna stick with it ! All pages are going to be organized loosely around a round centrepiece that I want to use in the fold-in and fold-out animations of each page. As I want to host each page as a separate flash application on a separate web adress within a separate HTML sheet thingy, it's important that they all have the same starting point and finishing point in their animation to facilitate linking them together, so the idea so far is to make them come out of a little sphere and fold back into it as well. It'll make a lot more sense once I got a working 1st mockup of that whole thing, which shall be the 1st thing I get down to once I got my final 8 page concepts.

Another thing that came out of all that is that I'm gonna need icons for each page, so there's more development on the said icons & the coming 3rd final concept as of yet-to-be, for the Art page :
So I got to a point where I'm comfortable with what precisely is gonna be on each icon, now it's all a matter of actually making them ...
And I'm planning on using signs and symbols I developed last term in our Beyond Desktop Publishing module on InDesign. I got a whole family of little pieces of squares, rectangles and circles that work within a square grid and I'm gonna use those to create neat simple icons that I shall then get onto flash through Illustrator.

It's all planned !
Now it's all a matter of actually getting down to it ...

More soon, hopefully I'll have a mockup by then.

Bie for now !

Saturday 15 January 2011

HOLY FLYING SHIT I DID IT !!!


















Why hellow people !
It's a bit of an informal greeting, but U'll get used 2 it if U're new 2 my style ...

So basically this is my 2nd blog, this is my 1st blog.
This post is mainly about this blog's layout, which I just spent HOURS fine tuning so it looks GOOD !
And CSS is a bitch ... but not that much 'cause it's working in the end so I'm content :-)
Oh and U should know that this blog is about the making of this website, hence the link at the top.

OK so basically what I did for the layout, as using a pre-created layout is out of the question, is work it out from my 1st blog (which looked like this when I started messing around with the code) so this blog's 1st layout was that ... not so groovy, I agree there.
So I went to dig out an old background I created myself a long time ago, stuck it on here, then messed around with CSS for a couple of hours, came up with a cool header picture, and BAMS, here it is ! IDK, I like it ... it's not all perfect yet, there's a couple of things that could be made better, like the comments section, but I'll start worrying about that when I get coments ... if I ever do.

Now why "Peter Whyts", you ask ? Well Peter Whyts (which derives from my middle name, Pierre, which gives you "Peter" in English and "Whyts" which derives "DJ YTS", an even older alias, which itself derived from "Yann the Stranger) is my old artist name from the times long ago (like, Middle~High School) when I used to make music on Fruity Loops ... that's damn right, Fruity Loops !!! But more like FL 3.4, FL 4 & up to FL 5 or so, not the latest versions ... obviously if it was a while back !
For the ones interested I still have 2 tracks from that era online on this old (German lol) website ... I did quite a couple of graphics that I'd use for my tracks too, there's one of them where you can see my symbol clearly ...
I'd work all that stuff out on MSPaint & sometimes even Word back then, I'll have to revamp my old symbol on InDesign, but now not, later on during this module.

Anyways so I worked out this old background from one of FL 3.4's default background !
The default looks like this (that's stolen straight from the software's system files lol).
Then I came along and MSPainted stuff onto it (this is how you do it kids lol). I used various assets in there, but one of them was an MSN icon I had created from the MyOwnMusic website's banner ... undortunately I could not fine the original icon back.
And Ta-Da ! There's ye background ! With my signature on it ... neat !

Last thing, I spent MORE ages messing around with the title pic so it could reditect to the website ... but I did it in the end. And I also added a neat pic that redirects to the other blog so ... YAY :-D !

So what you see here is what I came up for, as a general layout for this blog.
Like I said there's a couplf of things here & there that I'm not too happy with but all in all it should remain among those lines.

So, enjoy the posts, ciao !