sprockets Learn to keyframe animate chains of bones. Gerald's 2024 Advent Calendar! The Snowman is coming! Realistic head model by Dan Skelton Vintage character and mo-cap animation by Joe Williamsen Character animation exercise by Steve Shelton an Animated Puppet Parody by Mark R. Largent Sprite Explosion Effect with PRJ included from johnL3D
sprockets
Recent Posts | Unread Content
Jump to content
Hash, Inc. - Animation:Master

Recommended Posts

Posted

I'm working on an online portfolio and the advice I'm getting is to eschew the normal structure and not have regular menus, so I've decided to have a street with a row of buildings that represent different areas of my portfolio.

 

Obviously, a theatre would be the best place to have animation stuff for my portfolio, so it's the first building.

 

 

theatre_01.jpg

 

 

I see some places where the AI filter didn't do a good job with filling in some letters, so I'll have to go back and rework those.

 

I'm going to wait until I have everything done before I start putting textures on the models.

 

Next building is a comics shop.

 

 

 

 

  • Admin
Posted

Looking very good Mark!

 

'm going to wait until I have everything done before I start putting textures on the models.

 

That's a great approach.

You need to have a 'Be Largento!' graffiti spraypainted somewhere nearby...

I'm just sayin'.

  • Hash Fellow
Posted

Fine-looking work as always!

 


 

I see some places where the AI filter didn't do a good job with filling in some letters, so I'll have to go back and rework those.

I see a few cases in your pic that look like a typical Font Wizard problem where it creates a four-sided patch that has two sides in a straight line (looks like a triangle). If you nudge the center CP out just a hair it will fix the patch.

Posted

Thanks, guys!

 

Let's hope it does the trick and gets me a job!

 

Rodney, I'm already uncomfortable with that phrase. If I were to use it, it would be unbelievably arrogant.

  • Admin
Posted
Rodney, I'm already uncomfortable with that phrase. If I were to use it, it would be unbelievably arrogant.

 

 

All the more reason to use it?

Embrace your largentness. You deserve it.

 

Perhaps the graffiti could be a less enthralling, "Hire Largento!"

Just doesn't have quite the same ring to it does it.

 

I might not have particularly cared for "Be Largento!" the first couple times I read it but it grew on me and I learned to embrace it.

 

Subconscious messages spray painted onto walls are just hype for nefarious marketing and entertainment purposes. No crime in that!

Being echo'd by you it takes on the form of commentary (shades of parody and satire) on the strange largento-adoring-affectations of the masses. :)

 

It'd be a lot more fun if your first name was Bob though. Then you could sign all your work "B. Largento".

 

Sorry... I'll stop now. ;)

Posted

As the only person who actually *is* Largento, I alone can say that I wouldn't wish being me on anyone. :-)

  • Admin
Posted

Wait just a cottonpic... ... ...

 

You say 'Be Largento!' is unbelievably arrogant and yet you've got an entire city named 'Largentoville' named after you already?

Do you have any earthly idea how much money it'd take to bribe folks into naming a town (or website for that matter) Rodnocity?

 

Life is truly and eternally not fair.

Posted

test_cho0.png

 

An update. Yesterday I had to switch gears and put together a down and dirty portfolio for a job opportunity that came up. I hope I can finish this soon and send them a link to it, since I'm sure this one will be much more impressive.

 

Obviously, the comic shop will be where I have my comics work, but the billboard on the roof will have one of those "Advertising Works!/Your Ad Here!" slogans on it and will be where I have my advertising work.

 

The last building is the big one. It's going to have three floors.

Posted

Another update!

 

Now the third and final building is modeled. The bottom floor is going to be a print shop, the second floor is a newspaper and the third floor is going to be an Internet company. That will cover my print work, a blog & my press clippings and my web design. I'm going to put a mailbox in between the 2nd and 3rd building to click for my contact info.

 

I've still got to do the sidewalk/curb/foundation that will let me separate this from the background. I'm also going to model a bi-plane with one of those banners for the upper left corner.

 

test_cho0.png

  • Admin
Posted

Wow. If I'd have grown up in Largentoville that street would be where I'd want to hang out.

Comics... movie theater... printing press...

Some folks might want to visit but I wanna move there!

Posted

Thanks, Rodney!

 

Here's the color version! Now I've got to work on the second level of the website.

 

portfolio_front.png

  • Admin
Posted

Most impressive!

Love everything about it... the details... the color.

I do see what Matt is saying about the contrast with the ad works sign though.

 

You should add partial buildings to the right and left to suggest this is only one part of a larger picture.

Perhaps they could be grey so as to indicate they aren't active.

Also, I assume you must have thought the maibox was getting lost if it is put in the middle of the image (i.e. between the comic book store and the print shop)?

One of the reasons I suggest the building continuation is to decrease the empty space around the whole image.

Folks seem to like that extra space but it drives me batty.

(Like this forum.... it has entirely too much extra space wasted on the left and right sides of the forum)

I believe you've already got the building(s) built for your other projects.

 

Added: That'd make a great business card as well if you have a version with contact info.

And I know you are in no position to afford it but can you say... l e n t i c u l a r 3 D !

Posted

Thanks, guys!

 

@ Matt, I was thinking about just making the white brighter, but I think I'll make it simpler to read, too.

 

@ Rodney, that's a great idea for the business card. I may very well do that. This is going to be broken up and used as the front page/menu for my website. I wanted it isolated, so the blue color will be identical to the blue background of the webpage. I played with putting the mailbox in a few places, but ultimately, I wanted to have it at 3/4 view, so the corner became the best place for it. I'm going to have the contact page linked to both it and my name (in case folks don't see it.)

Posted

What about the old silohette skyline in the bkgd trick?

 

I was thinking too (spitball-brainstorming) depending on how good your HTML skills are... what if the POV shot of the city-scape changed as the viewer scrolled down your webpage, to give a vertical multiplane effect of the camera lowering in Y space- might be cool-ola!

 

I just googled it... it is called 'parallax scrolling html5'... was the 'big thing' in 2013... so at least now I know my big ideas are AT LEAST 1 year behind everyone else's...! anyway- can't wait to see what you do.

 

This is 'kind of' the idea... an example of parallaxing website. http://avathemes.com/HTML5/Pulsar/

tempry.jpg

  • ____ 1
Posted

That looks cool, Matt! I had originally intended to put some kind of skyline back there, but started pulling back on stuff. Now that I see your mockup, I'm thinking that's something I should go back to.

 

I know Adobe Muse had some way of doing the parallax scrolling, where items scroll at different speeds, but I don't have it anymore. :-) I think I'm going to go ahead and do mouseover replacements, but the obnoxious thing is those don't work with touch screens. There's no way to mouseover something with touch. It's either you're touching it or you're not.

 

The idea that's been appealing to me is have it so that when you mouseover the theater, one of the doors opens and a character is leaning out with a dialogue balloon saying, something like "click here for animation." And then if you mouseover the billboard, a guy would appear from behind it at the top, saying to click there for advertising samples. etc. etc.

 

I did a website menu back in the olden days that used that trick, but loaded an animated gif, so that it looked like flippers that animated flipping over when you moused over them, but the limitation of colors with gifs would be a hindrance here. I used to do tons of Flash stuff at work (the first was recreating that flipper menu in Flash), but these days, nobody uses it and if someone goes to the site on a mobile device, it won't be viewable.

 

What might work is to see if I can use some html 5 animation to reload those images in a pattern, so they cycle through all the options. I may give that a try.

Posted

Yeah- Flash rocked for all the cool stuff you could do with interactivity... a really great 2D ink-n-paint software too, to boot! I have the CC suite, have not tried Muse, Edge or Reflow yet(OR for that matter- FLASH which claims to be phone friendly nowadays!)... TOO MUCH TO LEARN and TOO MANY DISTRACTIONS! Animated gifs are so 'old school' but never go away. The parallax idea I had was more of using the scroll wheel to 'flip' thru an image sequence- in this case your storefronts which would be prerendered with a camera-crane 'drop' in Y space... so as the viewer scrolled down the page the POV would give a nice 3D effect. KINDA like this... but vertically: http://ertdfgcvb.ch/p2/sm/play/protog3

 

OOOH! COOL! http://discover.store.sony.com/be-moved/

  • ____ 1
Posted

I built the Wannabe Pirates site in Muse. It's easy to use, but like most apps that do that, it generates large files. I'm going to try to do it in Flash and export as JS and HTML 5. Be a learning exercise. :-)

 

Going to see if some of my old Flash can be exported, too, so I can have site be Flash free.

 

That Sony example is very cool.

Posted

Hey Mark.

 

Do you remember the animated screen saver back in the early 90's called "Johnny Castaway." It was an animated guy living on a teeny island.

He would fish every now and then. Sometimetimes he would run behind the palm tree, change into his jogging suit and run around the palm tree.

All kinds of fun, random things would happen.

 

You should have some random things animated on your street on the flash site.

 

Here's a video of the Johnny Castaway screensaver....it just ran all day and night as long as your cp was on:

 

https://www.youtube.com/watch?v=hVgGfKY91Lg

 

William

Posted

Johhny Castaway... COOL! Loved the old 8 bit days working with Electronic Arts 'Deluxe Paint'...

 

Adobe Flash CC 'can' export to html5 with limited features using the Adobe Flash Professional Toolkit app and a feature(plugin?) called createJS... it really looks WIP-ish but might pan out to be something and save the day for Flash-to-html5... info:

 

http://www.adobe.com/devnet/createjs/articles/getting-started.html

 

this page seems to be newer info:

https://helpx.adobe.com/flash/how-to/creating-publishing-html5-canvas-document.html?set=flash--whats-new--2013-12

Posted

My experiments were less than desirable. :-)

 

For straight animation, it seems to work pretty well, but for interactivity, not so well. There are a couple of things that may be a problem. One is that I'm back to using Flash CS6 and Adobe may not be updating the extension for that version. And two, the files I was using were created many years ago with earlier versions of Action Script, which might make them less compatible.

 

For now, I think I'm going to use image replacement. I was planning on carving this up anyway and I'll make it so that if you hover over one of the parts, it swaps out that image for another one. I found a way to create a scalable image class in CSS that will let the main image scale to the size of the browser window. That was a huge plus because I didn't want people to have to scroll around, yet I wanted to make the image so that it could be huge on large screens.

 

I may come back after I've built the guts of the website and play some more, but right now, I need to have a working portfolio sooner rather than later. :-)

Posted

Ugh. Feeling frustrated with this thing.

 

I've tried several ways to get what I want done and I keep running into roadblocks. I tried putting it together with Fireworks. No problem. Get everything right and everything works, but only in Safari. Chrome and Firefox don't line the images up right. So, after a couple of more tries, I went back to Flash. Set everything up in there, get everything working, but here's the kicker, the JS Toolkit exports it as a canvas and you apparently can't have embedded links inside a canvas.

 

I've been doing some reading and there may be an issue with me not having put any info in the "alt" tags, which might be why Firefox and Chrome aren't playing nice. Also something about a security feature that won't let you run javascript off of your hard drive.

 

I feel like I've wasted two whole days just beating my head against a brick wall.

 

Flash works fine and at this point, I'm seriously thinking about using it anyway. Chances are an employer is going to look at it on their computer rather than their personal device.

Posted

I may have spoken too soon. Just found Google's "Spiffy," which may very well solve my problems!

Posted

Ugh. Feeling frustrated with this thing.

 

I've tried several ways to get what I want done and I keep running into roadblocks. I tried putting it together with Fireworks. No problem. Get everything right and everything works, but only in Safari. Chrome and Firefox don't line the images up right. So, after a couple of more tries, I went back to Flash. Set everything up in there, get everything working, but here's the kicker, the JS Toolkit exports it as a canvas and you apparently can't have embedded links inside a canvas.

 

I've been doing some reading and there may be an issue with me not having put any info in the "alt" tags, which might be why Firefox and Chrome aren't playing nice. Also something about a security feature that won't let you run javascript off of your hard drive.

 

I feel like I've wasted two whole days just beating my head against a brick wall.

 

Flash works fine and at this point, I'm seriously thinking about using it anyway. Chances are an employer is going to look at it on their computer rather than their personal device.

 

I've never had good luck with building site front ends like yours. None of the browsers implement HTML let alone HTML5 in the same way, so you have to code in tests and workarounds for multiple browsers and browser versions to cover all of your basis. The alternative is to only support the most popular and place a disclaimer of "Best Viewed on ...."

 

I want to see you succeed, so that I can have you do the same for my site! My challenge is I'm using wordpress, so I have to marry this great stuff into that.

Posted

Oh yeah...SWIFFY! I messed with that a while back... speculation was that Google developed it as a tool to make their great daily Google doodles with splendid html5 interactivity and animation. It looks like it has come a way... with SOUND on MOBILE DEVICES being the remaining hiccup. The webpage utility has a 1mb limit but the downloadable Flash Pro extension does not?

 

It is good to see that Adobe has not given up on Flash... CC2014Pro has a lot of great new features(variable width line tool!)... one of them being the ability to convert to an html5 canvas- however you better be 'up' on your ability to code in javascript as well as actionscript- which means I would LOVE it if SWIFFY worked! I am not a coder.

Posted

Everything seems to work with Swiffy, but it does create a monster html file (everything on the page is written into the html file, including the images.)

 

WordPress is good, in that it has a lot of features that you can activate easily. It's still one of those things where I do a lot of trial and error and guessing to try to make it do what I want it to. I do feel like it does kind of hold me back, though. I feel like I can modify it enough to make it seem my own, but other things drive me crazy.

 

I'm going all-in on HTML5 with this portfolio. If it's going to take over everything, it doesn't make sense to spend a lot of time with the old stuff.

Posted

@Matt, the coding is still necessary for interactivity, but in most cases, you can search the web for how to do something and find a piece of code you can adapt or get a decent tutorial about. I remember in the early days of the web, I would find something cool on a website, snag their html and try to decipher the code to find out how it worked. :-)

 

For what I was doing, I sliced the image up into large pieces and made all of them buttons. I used a second sliced image as the hover over state and put it a tiny bit of actionscript to make them go to the specific url. Exporting it with the JS Toolkit in Flash did everything except making the links work. Swiffy did it.

 

I've downloaded the extension and installed it, but have only tried it once with an old game I made. It issued a laundry list of unsupported things.

Posted

I've downloaded the extension and installed it- with a little CC2014 trouble... had to use Extension Manager CS6 to convert the ZXP file to an MXP file, then the CC2014 Ext Mgr could see it and install it. WTF?

 

THEN--- I opened FlashPro CC2014 and saw that under 'Commands' is the export to html5 swiffy command... GREAT! Made a new document... made an animation of a ball moving L-R in 10 frames and then back to where it was in another 10 frames using Flash's create tweens feature. Then I used the swiffy export command but get this error about line 26(remember, my timeline is 20 frames...) SO... I'm stuck.

 

Yeah- I'm all about the 'search for code' and 'copy-paste-modify' approach... I think that is the way most coders work these days...

 

NOTE: The same 20 frame test worked in Flash Pro CS6.

tempry3.jpg

Posted

Hmmm. That's weird. The file I downloaded was an mxp file to begin with. I also used the Extension Manager to install it (I'm using CS6.)

 

Sounds like Adobe doesn't want folks using it. :-)

Posted

Sounds like the problem may have to do with converting the extension. Since I'm still on CS6, I was able to use the mxp file.

Posted

Wull, I think the problem lies in the opening and saving of the .swf and html files from CC2014... I noticed after the error code that files were generated but not opened or saved in the directory of the project but rather in the C/users/myname/AppData/local/Temp directory... of all places. I could open and view them from there.

  • Admin
Posted

Matt,

This isn't an option for Mark but Adobe Edge Animate is a great way to go for interactivity and compatibility across platforms/browsers.

For those that have the access it's well worth investigating.

 

What I find particularly nice about it is the Timeline that echos After Effects/Flash which makes putting projects together more like using a video editor or at times even A:M.

The latest release also adds some improved workflow for inserting/embedding/converting movies.

I did a test overlaying text on video and found that to work quite well.

There are also some additional Edge related programs for testing/emulating various devices but I haven't had much need for those yet.

 

For those with CC/2014, if an HTML5 based solution is desired Edge Animate is a nice option.

I would think that the primary benefit to using .SWF over HTML is having everything encapsulated in one file versus several.

Posted

Good points... I need to delve into those new CC tools... Edge Animate and Reflow which makes reactive html5 right out of Photoshop. I avoid webwork like the plague... turned down thousands of dollars worth of work because there is always more to it than people originally let on... it is highly frustrating to me. THEN there are website like WIX that will slam a website out for you fast...

Posted

I do have MotionArtist and should really put some time into it. It's not very intuitive. For now, I'm just using Dreamweaver to create the secondary pages.

 

I actually joined Patreon shortly after it started. I'm subscribed to Pomplamoose's YouTube channel and the guy from Pomplamoose started Patreon (or co-founded maybe). Either way, I joined it when I saw the announcement. The problem is I'm not generating any continuous content. It would have been awesome if I was still doing the webcomic, but for right now, there's nothing being generated.

Posted

Some updated images of the main page. I found the interior pages were getting too heavy carrying the blue background into them, so I decided to revisit the first page and try to make it a little more serious.

 

Here are the two stages of images that I made.

 

front_s1.png

 

 

front_s2.png

 

These were then carved up, so that I could have the page work with mouseovers. Here's an example with the Advertising sign selected:

 

screengrab.png

 

I also spent some time in Photoshop, doctoring the images.

  • ____ 1
  • Hash Fellow
Posted

Ideas...

 

- on "Largent, Mark, R." is there a way to make the L and M justify better? Perhaps a custom designed M with a vertical side.

 

- will the three descriptive lines beside your name be active links that go somewhere? Or perhaps mousing over them would highlight relevant portions of your cityscape? If mousing over "3D animation" highlighted the theater somehow, that would help quickly convey the idea that The Paunk Show is examples of your 3D animation.

 

- The guy at the bottom looks like his pants are falling down.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...