via jPanelMenu | A jQuery Plugin for Awesome Navigation:
jPanelMenu is a jQuery plugin that creates a paneled-style menu (like the type seen in the mobile versions of Facebook and Google, as well as in many native iPhone applications).
Just click on the menu button (the top left of this page) to see it in action.
Interesting.
Twitter Bootstrap Button Generator | PlugoLabs.
Nice Button generator for twitter bootstrap. Been playing around with Twitter Bootstrap a bit, and this is really handy.
The iconic font designed for use with Twitter Bootstrap
via Font Awesome, the iconic font designed for use with Twitter Bootstrap.
Set column and gutter widths, choose the number of columns, and switch between pixels and percentages.All without any .grid_x classes in your markup. Oh, and did we mention it’s responsive? Runs on LESS, SCSS, or Stylus. Read up on Smashing Mag.
Just noting for future reference…
Omega – Responsive HTML5 Base Theme
Web Content Management Systems from a Designer’s Perspective
The Right Way to Wireframe, Part 1
4 different interaction designers took four different tools to prototype with. A number of things stood out for me:
1) Balsamiq is probably the wireframing tool we should be using.
2) They have a longer research/prototyping phase and peer reviews prior to showing work to clients.
3) There is a clear distinction between Interaction Design roles and visual/graphic design roles on all 4 of the teams involved – the two are separate people.
CSS Framework Shootout
The did an overview of four major CSS Frameworks. some of them we’ve already been playing with to consider possibilities of making our CSS cleaner and lighter. Lots of good information there. I need to explore OOCSS more closely because I think it may be the approach we take going forward.
CSS3 Design with HTML5
Lots of cool new stuff you can do with html 5 and CSS3 – doesn’t have complete cross-browser support, so we’d have to consider progressive enhancement and whether that would work for our clients.
CSS and Fonts: Fluid Web Typography
Jason Cranford Teague
My favorite panel so far. On Typography – the major change this year is that more browsers are starting to support embedding font types, so @font-face will work in more browsers. There are still EULA issues to think about, but this opens up new possibilities for us in terms of design.
Two panels that we were able to make it to after flying in today…
Getting Stoked about Web Typography
Samantha Warren
Went over a lot of stuff I knew already about finding inspiration in typography – but it was refreshing since we really back-burner our typography in our designs, partly because of the technology concerns. She covered more inspirational ideas than technical application. I like designing around typography and wish I could use more of it in our designs at work. She stepped through a bunch of URLs I captured – I’ll go back and take a look at them when I have more leisure time. She urged looking outside web design for inspiration on typography – she uses the skate and surf communities for inspiration.
She over-viewed several techniques for introducing fonts beyond the standard browser fonts but noted there were other panels diving into the more technical side. I still suspect there isn’t a great solution for our companies work yet – the cons seem to stack a bit to high for accessibility in some cases, and for dynamic content in others. We also have the hurdle of EULAs – taking a font license cost onto our sites could be a challenge. But it’s definitely an area I want to play around more with – I’ve done typekit work on my Naptown Argus site – I want to try out the @font-face solution.
Simple Steps to Great Web Design
Matthew Smith
He only got through a bit before the firebell rang –
Know your client
know their audience
know their content
All pretty obvious stuff. He may have been building towards a crescendo, but I would have had to climb three flights of stairs and squeeze into a crowded room to find out. 🙂
In General
Way more crowded than it was in previous years. Some panels you can’t even get into unless you arrive WAY early.
Lots of interesting marketing going – 3D barcodes everywhere on posters, badges, etc.
I’m taking off on Friday for SXSW in Austin, Texas. I’ve been there a couple times in the past in 2007 and 2008. I’m having a bit of anxiety about the trip after the doozy of a time we had in 2008 (stuck on a plane on the tarmac for 6 hours in Dallas, then driving from Dallas to Austin) so I’m kinda keyed up. The weather forecast is much better this year, but then again, it was fine last time, too. 🙂
But I’m trying to stay optimistic about the trip; it couldn’t possibly go as bad as last time, right? I’m hoping to learn a lot and see a bunch of cool new stuff. I need to do a bunch more prep work; this time I’ll have a much better camera with me, and Austin is a really cool city.
I’ve been dissatisfied with the navigation methods here on my site for a long time – I was very frustrated by the long, unwieldy category list from the sidebar – I’ve always organized by category, but the display of that navigation sucked, because it was hard to tell that there were categories and sub-categories, and the list was way long. The sidebar looked cluttered, and in general I didn’t feel like writing because I hated the way my site looked.
I knew the solution was to approach it differently; I needed a drop-down, fly-out menu bar along the top of the site. But I was afraid to tackle the task because tangling with the lack of support materials for Movable Type has been problematic in the past. (see the related categories at the bottom of this post.)
But I spent a bit of time with this post: “Creating Drop-Down Navigation with Movable Type” and worked it out. I knew I didn’t want to use the MooTools solution he offered, so I adapted his work and integrated it with this “Simple jQuery Dropdowns” solution, because I knew I want to use jQuery for some other rich behaviors on the site in the future.
Now the categories make more sense because you can see sub-topics and sub-sub topics. And it’s all neatly folded up along the top of the site. I had some testing problems in IE7 – dunno if I cleared them up completely yet or not. I may need to do some fixing there still.
Because it’s cleaner and neater, I didn’t mind adding some categories that I needed; stuff I’ve been writing/posting links about like feminist issues and photography, and yes, your favorite and mine — knitting. I still need to step back through old blog posts and move them to the appropriate categories, but going forward, things will land in their own spots.
And the change in categories helps me re-think and get excited about things that I used to write about that have fallen by the wayside.
The removal of that long category list down the side means I had a lot more room in the sidebar and you can see items there much better. Many of the pages aren’t as long now, and all of them can breathe more. I rearranged my ads a bit because those help pay for the site.
So I’m feeling fresh and clean and exciting, like a feminine hygiene ad. I may go walk on the beach. While knitting. And then I’ll tell you all about it.