I want to write an in depth tutorial on this kind of thing some day, I've just had so many other projects I haven't had the time. :< So here's a quick and dirty rundown of your questions. I'm happy to answer more or help you with things if you have more questions. I'm Kitten4u#8675 if you'd prefer to contact me there.
I don't have time to go through all the variables at the moment, but the ones most relevant to you are going to be under board or current_user. Board is everything related to the board and current_user is the user currently viewing your skin. As an example, I'll go into the variable you specifically asked for: the last poster's avatar. Half the battle here is figuring out how to think about the hierarchy. Information is stored relative to other pieces of it. Proboards is really bad at documenting these features, but their choices for variable names are pretty good. If you straight up have no idea what something might be for, then odds are you don't care about it. The best way I find to think about this, is to go backwards.
Okay, so you want the most recent poster's avatar. To get that, you need to know the most recent poster.
To know the most recent poster, you need to know about the most recent post that was made.
To know about that, you need to know which thread was last posted in.
And you want it to be board specific, so that'll be in board.
So if you click on the dropdown arrow on board, you can see all those things and the variable comes out to $[board.last_thread.last_post.created_by.avatar]. It's just a matter of practicing and getting used to it, and then you'll kind of intuitively know where to look for things.
A lot of the other stuff you asked about is a matter of design and design is a lot harder to teach. A lot of what applies to designing headers or any other parts of a skin will apply here too. But to give you a place to start, here are some basics.
- Always think about which information is the most important and what information you want people to see first. Draw your users into doing what you want them to do. For boards, this is probably going to be clicking on the board link to go to the board, and seeing what was last posted in that board. Thus, your board link and the last poster area should probably be the most prominent areas.
- Are your board descriptions important? Do you want people to read them? Then don't shove them off into a tiny corner. That'll make people think they're not important. If they're not important and you don't care if people read them or not, then doing such things is fine. It's just a matter of getting into your users' heads and figuring out what you want them to do.
- I recommend having the sub-board list on the index. You want your users to interact with your site, but users are lazy. Helping them get to where they want to go increases the odds that they will.
- Avoid icons with no text associated with them. I know everyone loves icons right now, but having to hover for any information is really obnoxious and lazy users generally won't do it. Any information you want to be seen should not be hidden.
- Avoid gifs, they're bad for loading and can cause issues for people with sensory problems.
- Whitespace is good. You don't want things to be too cramped.
- If you want something to stand out there's a few ways to do it: use a really contrasting color, make it bigger, put it on the left side (we read left to right, so we tend to notice stuff on the left first), or put a generous amount of whitespace around it.
The rest ultimately comes down to what you want to do. Designing can be difficult, but it's very fun and rewarding when you get it right. :3
| 
