PDA

View Full Version : Portfolio critique?



kalero
06-03-2011, 03:41 PM
Hey gang, I finally have something less painful to look at by way of an online portfolio. I don't really get as much of a kick out of HTML as I do modeling (clearly - it's pretty primitive, I realize...), so I wondered if you might have some comments on what I could do to make this more enticing? By way of convincing someone to pay me to do what's already entirely too much fun...

My real love so far is modeling, but I wondered if I should try to get more samples of animation up there, or rigging? Maybe I should try to separate it out into logical categories (rigging, texturing, modeling) rather than project-based? I guess I'm wondering if this kind of thing is sufficient, or if I really do need to make a demo reel, even if I'm not planning to make animation my core focus?

I started tracking the journal-entry stuff partly to keep straight in my mind how long things were taking me, but also because my degree is in something very non-artistic and boring. I thought it might help to show how I've been educating myself.

Thanks in advance for your advice, input, feedback, and possibly ridicule. ;)

http://www.happyfunpoints.com/

ArtGoblin
06-03-2011, 05:18 PM
Well... just a really quick observation, since I don't have a lot of time right now.... after a really quick browsing of your projects, I noted that you have some really good models there in terms of clean and nice poly-flow. So that's one thing you should in a way amplify. So if I take the bunny for example... Instead of putting up an render of the bunny with some fiberfx put on, I'd recommend you'd do a clay render with Sub'D wireframes. All you basically need is to get Art Sphere's Polygon Coloring plugin and run it on you're model (in modeler) then you'll end up with some new surface's in you're surface editor. Take one of those surfaces and open up it's node editor. There, all you need to plug in is a basic gray color node into your color input, then plug in an occlusion shader into the diffuse channel. Copy and paste this surface over all the new surfaces. Then make a big enough plane (to catch the shadows underneath the model) and apply a basic gray color on it as well. Then send the bunny object and the plane object to layout. In Layout, open up your scene editor and turn of the direct light. Then set up a white or gray color as your backdrop. Turn on global illumination. Open up your bunny's object properties panel and in the edges panel... turn on surface borders. Then set up your camera and try a render. Here you'll find the plug in I mentioned http://www.artssphere.com/plugins.php

Just a quick idea... you can of course play around with these settings to get all kinds of different effects, but the point with this would be to emphasis your nice modeling instead (and here comes the bit harsh part).... instead of just another rendered image of a bunny with some basic fiberfx slapped on. Hope it helps :)

speismonqui
06-03-2011, 05:44 PM
maybe the squirrel and bear renders would be more interesting with a color background. I'm not talking about a forest, but maybe a plane casting shadows or a stage.
Right now they seem like "floating" on the web page.

I agree with ArtGoblin, if you want to present your modeling skills I would go with a wire poly render (even a screenshot), a wire SubD render, and a basic (3 point light) textured render, no Hair or fibers. If you want to take it a step further, render a turntable.

Also, the ferret page has an AVI animation, it doesn't run on my PC (firefox). Maybe you could use a more standard and reliable compression (FLV, mp4) or even embbed it from youtube or vimeo. That way everyone can see it.

Hope that helps, keep it up!

lertola2
06-03-2011, 06:34 PM
I am an illustrator so I will give you my comments from that perspective. The six examples of art on your site are nice but rather ordinary. Your objects are very simple and probably would be great if they were seen at a distance. If I were looking to hire someone to do a 3d illustration I would find it hard to give the job to you with the art that you are showing at the moment. No one is going to give you a job to model lo rez animals. However some one will give you a job if you can show that you can create a compelling piece of art with your animals. The more you can show professional looking finished art the better off you will be. Your goal should be to turn your art into something amazing and something that people have not seen before. I think you should definitely spend your time making your 3d art better. Working on your website won't have any impact on getting a job if the art is not compelling. I would start by trying to improve the rendering of what you already have. At the moment they look very dark to my eye. Your goal should be to make your work look better than the best that you can find. Another goal you should have is to try to create your art as quick as you can with the minimum of work. Cut every corner you can without sacrificing quality (too much). You need to be productive if you want to make a living doing 3d art.

Titus
06-03-2011, 06:59 PM
I wondered if you might have some comments on what I could do to make this more enticing? By way of convincing someone to pay me to do what's already entirely too much fun...



I don't think you're at a point where someone is going to pay, but you have some space to grow.

My advice for you is to create a quality bar. Download examples of the best models, rigs, animations you can find online, and keep them as refrence for the quality you want to achieve. Is your work on par of the quality bar? if the answer is not, work hard to improve, If the answer is yes, you also have room to improve.

BlueApple
06-03-2011, 08:29 PM
If your site is to target potential employers, you may want to throw out the journal bit. I like reading about someone's evolution as an artist, and on my site I even post my own progress on projects, but it may not be a good marketing tool.

Imagine reading a blog from a physician and coming upon "wow, it is so much easier to do stitches in a patient this way. I can't believe I had done it differently for so long."

When people hire other folks, they generally want to think they are currently good at what they do, and not that they are in the process of getting better at it.

If you love modeling, show off your models. Show a bunch of models. Look at all of your models, throw out the ones that you know aren't that good and only display the ones that show how good you are at what you do.

If you want to add some animation to the site but want to focus on modeling then add some turntable animations. These provide excellent views of models and add a 4th dimension to the content on your site, while allowing you to stay focused on your modeling.

Don't sweat the html. If you have a clean site that is quick to load, easy to read and uses clear navigation, your content will matter far more than your web coding skills.

Best of luck.

cgisoul
06-04-2011, 05:26 AM
Honest opinion....... re-design entirely your website.
It needs to be restructured.

I don't mean to be rude or anything. Just being helpful and above all, honest.

P.S. Please remove that box on the right.

Traveler
06-06-2011, 06:31 AM
Hey gang, I finally have something less painful to look at by way of an online portfolio. I don't really get as much of a kick out of HTML as I do modeling (clearly - it's pretty primitive, I realize...), so I wondered if you might have some comments on what I could do to make this more enticing? By way of convincing someone to pay me to do what's already entirely too much fun...

Honestly, it still is painful to look at. You have a lot of different styles going on. There's an unattractive purple background, nothing is aligned, images break out of containers, various font types and colors, different border types etc. Overall, it makes it all very hard to look at.

I've tried to create something based on your site (see attachement). Its been a quick 15 minute Photoshop job, but it shows the general direction you could take.



My real love so far is modeling, but I wondered if I should try to get more samples of animation up there, or rigging? Maybe I should try to separate it out into logical categories (rigging, texturing, modeling) rather than project-based? I guess I'm wondering if this kind of thing is sufficient, or if I really do need to make a demo reel, even if I'm not planning to make animation my core focus?


I think you should focus more on what your want (Which apparently is modeling) and then, when you feel comfortable enough with that, continue with rigging and texturing. Others have already said it well enough. It's clear you understand the basics, but I don't think you're at the level where people are going to pay you for your work.

I hope this helps.

OnlineRender
06-06-2011, 06:33 AM
work on the content first , exactly what you want to display , then worry about the webpage , I would suggest simply installing wordpress and using that as your template .

50one
06-06-2011, 08:06 AM
Don't have time to write it down myself, but here is the crazy good article with lots of good tips, that may be useful for all the "new" web designers out there, that want to create their online portfolio.

http://www.smashingmagazine.com/2008/03/04/creating-a-successful-online-portfolio/

kalero
06-06-2011, 08:11 AM
You guys are amazing. Thanks for taking the time (especially the PS mockup - that's a million times better, and I should be able to make those changes pretty quickly) to straighten me out. You even managed to throw in some encouragement with the crits, which gives me hope for the future!

ArtGoblin - I seriously can't wait to try out what you described.

I know it's basic and absolutely amateur hour for me right now - but I don't think I knew enough to know WHY it's bad. Now I know the most striking points causing the problems, and I can work on those. I mean, if my stuff looked professional after 9 months, this would obviously be too easy to learn, right? :)

ArtGoblin
06-06-2011, 08:47 AM
9 months.... not bad I'd say... as a comparison for you I dug up some old threads I made here.... amateur hour indeed for me :D and I also would like to note that at the time I made those projects I had been dabbling in LW for much more that 9 months...

http://www.newtek.com/forums/showthread.php?t=32565
http://www.newtek.com/forums/showthread.php?t=33190
http://www.newtek.com/forums/showthread.php?t=33077

now compare that stuff to what I have in my portfolio today and I'd say the long hours and stubbornness has paid off

OnlineRender
06-06-2011, 10:35 AM
Copy your index.html and happy.css from the root , replace the code with this .



INDEX.HTML


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

<html>
<head>
<title>HappyFunPoints.com - Kalero's Portfolio</title>
<style type="text/css" media="screen">@import "happyfun.css";</style>
</head>
<body>
<div class="content2">

<a href="http://www.happyfunpoints.com/">

<img src="http://www.happyfunpoints.com/happy.png" border="0">

</a>
</div>


<div class="content">


<a href="bear.html" title="Bear"><img src="\samples\thumb\THB_bear.jpg"></a>
<a href="bunny.html" title="Bunny"><img src="\samples\thumb\THB_bunny.jpg"></a>
<a href="dragon.html" title="Brass Dragon"> <img src="\samples\thumb\THB_dragon.jpg"></a>
<a href="ferret.html" title="Ferret"><img src="\samples\thumb\THB_ferret.jpg"></a>
<a href="hat.html" title="St. Patty's Hat"> <img src="\samples\thumb\THB_hat.jpg"></a>
<a href="squirrel.html" title="Squirrel"> <img src="\samples\thumb\THB_squirrel.jpg"></a>

<hr color=#333><br>

<h2>Video <font size=-2><i>May 23, 2011</font></h2>
<p> <span id="cap">G</span>nomon Workshop video <a href=http://www.thegnomonworkshop.com/store/product/339/The-Secrets-of-Organic-Modeling>The Secrets of Organic Modeling</a> - what an incredible effect this has had on my modeling. Looking forward to spending a lot more time reviewing this tutorial.</p>
</br>
<h2>Software <font size=-2><i>April 22, 2011</font></h2>
<p> <span id="cap">L</span>ightwave 10 ships! (well, MY copy does anyway)</p>
</br>
<h2>Software <font size=-2><i>March 25, 2011</font></h2>
<p> <span id="cap">D</span>ownloaded MotionBuilder 2011 to use with my Kinect and the <a href=http://www.brekel.com/?page_id=155>Brekel</a> software. Because mocap is nifty.
</br>
<h2>Book <font size=-2><i>March 9, 2011</font></h2>
<p> <span id="cap">P</span>icked up <a href=http://www.amazon.com/gp/product/0240811887>How to Cheat at Maya </a> and <a href=http://www.amazon.com/gp/product/0571202284>The Animator's Survival Kit</a></p>
</br>
<h2>Group <font size=-2><i>March, 2011</font></h2>
<p> <span id="cap">B</span>egan volunteering with the <a href=http://wp.siggraph.org/detroit/>local SIGGRAPH chapter</a>. I was able to help out by managing the group's main Wordpress & signup123 sites, to announce & track events, membership, and payments.</p>
</br>
<h2>Hardware <font size=-2><i>February 25, 2011</font></h2>
<p> <span id="cap">T</span>he laptop gets a new <a href=http://www.newegg.com/Product/Product.aspx?Item=N82E16820148357>SSD boot drive</a>, everything loads instantly!</p>
</br>
<h2>Hardware <font size=-2><i>February 2, 2011</font></h2>
<p> <span id="cap">W</span>acom <a href=http://www.amazon.com/gp/product/B001TUYTZW>Intuous 4</a> ships, drawing will never be the same.</p>

</br>
<h2>Software <font size=-2><i>January 25, 2011</font></h2>
<p> <span id="cap">M</span>aya 2011 downloaded, begin working on <a href=http://usa.autodesk.com/adsk/servlet/index?linkID=9242256&id=9502844&siteID=123112> Getting Started with Maya 2011</a></p>
</br>
<h2>Group <font size=-2><i>January, 2011</font></h2>
<p> <span id="cap">M</span>acomb Community College has a user group devoted to getting people together to motivate & help with portfolios. I sign up (student status not necessary!), but they all work in Autodesk, I'm gonna need Maya.</p>
</br>
<h2>Book <font size=-2><i>October 16, 2010</font></h2>
<p> <span id="cap">O</span>rdered <a href=http://www.amazon.com/gp/product/0321426843>Inside LightWave v9</a></p>
</br>
<h2>Software <font size=-2><i>October 13, 2010</font></h2>
<p> <span id="cap">P</span>icked up LightWave v9</p>
</br>
<h2>Software <font size=-2><i>September 4, 2010</font></h2>
<p> <span id="cap">B</span>lender installed, beginning this whole crazy ride. <a href=http://en.wikibooks.org/wiki/Blender_3D:_Noob_to_Pro>Blender Noob to Pro</a> makes it almost easy to get a grip on basic concepts and create my first successful Unity-imported animated objects.</p></br>
</div></br>

<div class="content">
<a href="http://www.happyfunpoints.com/" title="Back to HappyFunPoints">&lt; Return to HappyFunPoints</a>
</div>

<div id="navBeta">

<h2>Projects </h2>
<hr color=#333><br>
<p>
<a href="ferret.html" title="Ferret"> Ferret </a> <br>
<a href="dragon.html" title="Brass Dragon"> Brass Dragon </a> <br>
<a href="hat.html" title="St. Patty's Hat"> St. Patty's Hat </a> <br>

<a href="squirrel.html" title="Squirrel"> Squirrel </a> <br>
<a href="bear.html" title="Bear"> Bear </a> <br>
<a href="bunny.html" title="Bunny"> Bunny </a>
<h2>Links</h2>
<hr color=#333><br>
<p>
<a href="http://www.newtek.com/forums/member.php?u=99387" title="NewTek forum profile"> NewTek forum profile</a> <br>
<a href="http://kalero.cgsociety.org/about/" title="CG Society profile"> CG Society profile </a>
<a href="http://wp.siggraph.org/detroit/author/karamarf/" title="Detroit SIGGRAPH posts"> Detroit SIGGRAPH posts</a> <br>
<a href="https://3djunkies.net" title="3Djunkies "> 3DJunkies.net</a> <br>
</p>

</div>




CSS

body {
color:#969684;
background-color:#000000;
margin:20px;
padding:0px;
font:11px verdana, arial, helvetica, sans-serif;
scrollbar-face-color: #999;
scrollbar-base-color: #666;
background-image: url(bearwire.gif);
background-repeat: no-repeat;
background-position:bottom right;
background-attachment:fixed;
}
h1 {
margin:0px 0px 15px 0px;
padding:0px;
font-size:28px;
font-weight:900;
color:#46515C;
}
h2 {
font:bold 12px/14px verdana, arial, helvetica, sans-serif;
margin:0px 0px 5px 0px;
padding:0px;
}
p {
font:11px/20px verdana, arial, helvetica, sans-serif;
margin:0px 0px 16px 0px;
padding:0px;
}
ul {
padding: 0;
margin: 0;
list-style: none;
}
li {
float: left;
position: relative;
width: 10em;
}
li ul {
display: none;
position: absolute;
top: 1em;
left: 0;
}
li > ul {
top: auto;
left: auto;
}
li:hover ul, li.over ul { /* lists nested under hovered list items */
display: block;
}

.Content>p {margin:0px;}
.Content>p+p {text-indent:30px;}

a {
color:#5C5146; /* PROJECTS */
font-size:14px;
font-family:verdana, arial, helvetica, sans-serif;
font-weight:600;
text-decoration:none;
}
'a:link {color:#4e6;}

a:hover {background-color:#999;
color:#FFF}
a:visited {color:#3E4DAD} /* LINKS */

/* All the content boxes belong to the content class. */
.content {
position:relative; /* Position is declared "relative" to gain control of stacking order (z-index). */
width:auto;
min-width:120px;
margin:-12px 210px 20px 170px;
border:1px solid: silver;
background-color:white;
padding:10px;
z-index:3; /* This allows the content to overlap the right menu in narrow windows in good browsers. */
}


.content2 {
position:relative; /* Position is declared "relative" to gain control of stacking order (z-index). */
width:auto;
min-width:120px;
margin:-12px 210px 20px 170px;

background-color:black;
padding:0px;
z-index:3; /* This allows the content to overlap the right menu in narrow windows in good browsers. */
}
#navAlpha {
position:absolute;
width:150px;
top:20px;
left:20px;
border:1px 666666;
background-color:#eee;
padding:10px;
z-index:2;

/* Here is the ugly brilliant hack that protects IE5/Win from its own stupidity.
Thanks to Tantek Celik for the hack and to Eric Costello for publicizing it.
IE5/Win incorrectly parses the "\"}"" value, prematurely closing the style
declaration. The incorrect IE5/Win value is above, while the correct value is
below. See http://glish.com/css/hacks.asp for details. */
voice-family: "\"}\"";
voice-family:inherit;
width:128px;
}
/* I've heard this called the "be nice to Opera 5" rule. Basically, it feeds correct
length values to user agents that exhibit the parsing error exploited above yet get
the CSS box model right and understand the CSS2 parent-child selector. ALWAYS include
a "be nice to Opera 5" rule every time you use the Tantek Celik hack (above). */
body>#navAlpha {width:128px;}

#navBeta { /* right box */
position:absolute;
width:190px;
top:145px;
right:20px;
border:4px 666666;
background-color:#eee;
padding:10px;
z-index:1;
/* Again, the ugly brilliant hack. */
voice-family: "\"}\"";
voice-family:inherit;
width:168px;
}
/* Again, "be nice to Opera 5". */
body>#navBeta {width:168px;}

#fullShot {
position:absolute;
top:-30px;
left:170px;
}
#cap {font-size:22px; color:#465c46; font-weight:bold; float:left; height:30px; line-height:30px; overflow:hidden; margin-top:2px; margin-right:1px;}
* html #cap {margin-right:-2px; margin-top:2px;}

Image attached !

kalero
06-06-2011, 01:45 PM
Fun! I'm looking forward to the day when I can get a project farther than just the critters. Most of my forays outside this niche have been painful so far...

I put another version up as http://www.happyfunpoints.com/onlinerender.html - so I can play with different styles. I tend to default to black because it's easy, so I wanted to *attempt* something with color, but this might not be the best time to try to pick up an entirely new batch of skills, I suppose.

(btw Eggert is adorable)

What I really need is more models with higher quality, rendered with more attention to lighting and scene (composition?). Probably time to get some videos/books on those last two topics.