Posted Monday, December 10, 2007 8:34:47 AM by Derrick Ypenburg
If you have read my most recent article, Tools for Designers: del.icio.us and Flickr', I made mention of starting a CMX Blog piece for anyone interested in sharing their design and inspiration tools,resourceful solutions for their business, and for self-organizational purposes.
Please leave a comment on this post to share your thoughts. I look forward to seeing what you're up to and if I can get new ideas and be inspired by your ideas.
Posted Sunday, November 18, 2007 9:56:05 PM by Stephanie
Yes, it's rather embarrassing, but I admit it. I have a Facebook account. Though I resisted for a long time, I was recently convinced to join Facebook to participate in a birthday prank for a friend. Oh well, another social time sink.
On Facebook today, I was invited to join a group called "Blue Beanie Day." November 26th has been named Blue Beanie Day, in honor of Jeffrey Zeldman's photo, donned in a blue beanie, on the cover of his book, "Designing with Web Standards." It's a day to stand up and show our solidarity around accessible web development using Web Standards. And besides that, it'll just be plain fun!
Here's how it works:
- Buy, beg, or borrow a Blue Beanie and take a photo in it. Heck, you can even take a picture with your camera phone at the mall trying one on if you don't want to buy it. Maybe you'll put a beanie on your head or change a black beanie to blue with Photoshop. Be imaginative. Take a cool group photo of you and your friends wearing Blue Beanies. The possibilities are limitless. Show your beanie creativity.
- Post your photo, or photos to Facebook, the Flickr pool, and other social networks on November 26th, 2007. Remember to switch your profile photos that day on all your social networks, like Flickr, Twitter, Last.fm, iLike, Pownce, Dopplr... you name it.
- Promote Blue Beanie Day in your blog or wiki starting today. Tell all your friends to get ready for Blue Beanie Day. If you have a Facebook account, join the group and invite all your Facebook friends to this event.
You can participate without a Facebook account too. Just grab a beanie, make it blue and join in! See you there.!!
Posted Tuesday, October 23, 2007 8:20:01 AM by Paul Davis
Seems Comcast thinks that they can interfere with your web usage on their network. Apparently, if you have Comcast, you no longer are paying to use the bandwidth as you want - Comcast has determined various applications and services just aren't allowed. Things like peer-to-peer file sharing, other VOIP providers, Lotus email and FTP.
So, if you have Comcast and you've been noticing things not working right, it isn't your computer - nor your browser (for once!) - it is your ISP meddling in what you are allowed to do. Most likely they have a government mandated monopoly where you're at too, so you can't move to an ISP interested in just giving you service. If you have Comcast, make sure you let them know you do not appreciate their business practice and, if you can, leave.
Comcast violates net neutrality with this move and if those with Comcast don't make it an expensive business decision, other ISPs may feel emboldened to do the same. If they are taking an inch and not stopped, they will eventually make sure the only Internet service we get will be through their mutual business partners...
Posted Thursday, August 02, 2007 9:02:55 PM by Jim Babbage
We get a lot of positive feedback about our JumpStarts. They are a great way to kick start the design and production process and can really speed up development time. They're so great, I use them myself!
Last month I was approached by a personal trainer who needed a web site. A friend had been promising for about 4 months to make one for her but at the time she contacted me, nothing had yet materialized. My client was serious about promoting her business and really wanted to get her name on the web. As a small business owner, her budget was not very large and while her site was going to be fairly simple, she really wanted someting clean, professional and contemporary.
Enter CMX JumpStarts. After my initial meeting with Caroline, I experimented with a few JS's, and decided that Traverse City woud be the perfect answer. Opening the PNG in Fireworks, I created my own custom banner and navigation icons. When I was happy, I exported out full size jpegs for my client to view. With some tweaking, the design got a green light and I jumped right into development.
The site took less than a month in real time before it went live (that was tonight - woo hoo) but in actual production hours, it took less than a week. Traverse City saved me a lot of time and as a result saved my client a fair chunk of change, too.
There's still work to be done - we're nailing down keywords and she has set up a photo shoot so we can get some current shots of her and what she does on the site. But that's the beauty of a web site; as long as the site appears whole and complete, you can continue to add to it as new content becomes available.
If you have a chance, check out GRIT Conditioning for some Great Results in Training!
Posted Friday, June 29, 2007 1:17:04 PM by Zoe Gillenwater
There's no black and white distinction between what constitutes plagiarism and what doesn't. Sometimes its obvious, but often it's not clear if a new piece has crossed over the murky line. This includes design plagiarism.
An outside organization asked my employer for permission to use one of our web site designs for their own site that they wanted to create. I'm the designer of the site in question. We've explained to the organization that they may use the HTML and CSS from our site if they put a credit to me as the original author of the CSS inside the code — after all, markup is not really something you can copyright, especially the simple, no frills stuff I used on this small site.
But we've having trouble getting them to understand that though they can be influenced by the design, as any designer can, they can't blatantly copy it. They can have a similar layout and look, but they can't use the same images or content. This organization definitely wants to work with whatever guidelines we give them — they don't want to violate our copyright or step on our toes at all — but they don't appear to understand the distinction yet. I can't blame them.
How do you distinguish between sites that just have a similar style or layout and sites that are copies? I remember my art teacher in high school always telling us that we had to make our art at least 30 percent different from whatever source file we were using as inspiration (usually a National Geographic photo, since we had a whole floor to ceiling cabinet of old issues). I have no idea where she got this 30 percent figure from, and I still don't really know how I would evaluate if something was 10 percent different versus 40 percent different.
I gave the person who requested our design this guideline to tell if his design was plagiarizing or not: Once your design is different enough that someone could conceivably believe you created it without ever having seen our design, you should be safe. If someone came across your design and accused you of copying our design, could you reasonably defend your work by saying you'd never seen our site before, that it's just a coincidence?
By this, I don't mean to imply that if someone saw both designs they would have to be able to see no similarities, but rather that there could be some possibility the two designs were created independently. They could think it's possible that one used the other as a starting point, as long as they could also accept the possibility of the opposite.
Do you think this guideline holds water? Is it too loose? Too restrictive? Do you have a more precise way you determine what is just inspiration and what is copying, in terms of web design? I'd love to hear your thoughts on this in the comments.
Posted Monday, June 11, 2007 2:46:46 PM by Big John
A web buddy has just hipped me to This.
See that item down in the left corner? Safari now has a shiny new version number, and it works on the PC too. So old Stevie has entered the PC Browser Wars, eh? That should stir the pot a bit.
Posted Friday, June 08, 2007 9:43:44 PM by Jim Babbage
It's coming. In two short days, TODCon will be here once again. And I can't wait.
Bright lights, big city, geeks . . . what more could someone ask for?
And the line up looks great. Some very cool topics will be covered. No doubt much fun will be had in the city that never sleeps.
If you're attending for the first time, you're in for a treat. If you're a veteran (like me and many others) it will be great to hook up with all of you again. If ya can't make it this year, save them nickels and book your spot for next year. It's a great networking and learning experience for everyone. Not to mention the most fun a geek ever had.
I'm holding two sessions this year, one about Fireworks integration with Bridge and Photoshop and the other on working with the new pages and sub layers features in FW.
It's been fantastic to see what Adobe has done as they bring all the products into the Adobe family. New life (and I believe new respect) has been breathed into Fireworks. As the sole true web graphics program in the Adobe line, I'm seeing lots of new users coing on board. Many are skeptical, but once they see how fast they can work in Fireworks without having to switch applications, I think they'll be sold.
Old friends, I'm looking forward to seeing you. I hope to make some new friends too. I can't wait to see everyone.
Posted Monday, April 23, 2007 5:54:22 PM by Jim Babbage
I was lucky enough to score a ticket to Flash in the Can Toronto, which opened this past Sunday and continues through till tomorrow. I haven't attended this event in years but was glad I made it down there this time.
I hooked up with Tom Green off and on over the day on Sunday and then we were off to dinner with Betsy Weber and other good people from TechSmith for dinner that evening. Techsmith is the wonderful company which has brought us great programs such as SnagIt for screen capturing (and more) and Camtasia for screen recording.
Tom was non-stop entertainment, let me tell you, as he narrated in gut-splitting humor some of his travel adventures. He really needs his own cable show.
One seminar I attended was of particular interest. Led by Kevin Airgid, the session was titled Relationships + Skills = Money. With a moniker like that, it was no wonder the room was full.
And Kevin delivered, too; for 60 minutes, he spoke and answered questions about how to be successful as a freelance web designer. It was a very enlightening seminar, and I was more than a little proud of myself to note that when it comes to billing and building client relationships, his approach is similar to mine. I also learned many things that I'm going to put into action over the next little while.
Much of his advice comes from his book and - with the support of fitc - Kevin has made his Web Designer's Success Guide freely available in PDF format. It's chock full of useful advice and definitely worth the read.
This session alone made the time spent at FITC worthwhile and I'm planning to head back again on Tuesday. Sadly, today was a teaching day so I could not attend any sessions.
Hanging out at the event has also made yearn for TODCON, coming this June. TODCon is my favorite event, and I schedule work and vacation around it so I never miss attending. It's a great opportunity to learn, network and hook up with good friends, people who I do not see nearly enough throughout the year.
So, if you've got some free time in June, mark your calendar and make sure to head over to TODCon. You'll never learn so much for so little . . . or have so much fun with a hundred or so other geeks. :-)
Posted Saturday, April 21, 2007 12:52:46 PM by Stephanie
There's been a wide range of reaction to Adobe's new CS3 icons. Admittedly, when I first saw the single Dreamweaver icon, I was taken aback -- "Is this thing finished?" But after seeing the whole suite, especially on the color wheel, I thought they were nicely done and easy to differentiate as I got a few in my dock. There were many who thought differently though. It was a love it or hate it kind of thing.
For those of you in the hate camp, there's an option. Adam Betts, a very talented designer, has created his own set of CS3 icons -- and released them, free, to the public. He based them on the box design and they look quite lovely. He's even made a new set of document icons if the plain ones don't quite do it for you.
What they'll look like at the smaller sizes, I can't say. There are no instructions included for where to install them, and at this point I haven't a clue. (Feel free to point me in the right direction if you know. :))
There are a few other sets I've run into if Adam's aren't your favorite. Mac Themes is similar to Adam's, Louie Mantia has a set that blend the old icons with the new box look, and if you like the new ones from Adobe but would rather have them a little sexier, koregraphik.com made a set with nicer gradients and rounded corners. Check them all out.
Posted Monday, February 26, 2007 1:29:59 PM by Zoe Gillenwater
Alright, it's not my book in the sense that I'm not the author, but rather the technical editor, but still: the name Zoe Gillenwater is in print, sitting in a Barnes and Noble, and that's pretty cool. The book is Mastering Integrated HTML and CSS by Virginia DeBolt. It's aimed at people without experience in either HTML or CSS, and I really like the approach Virginia and the publisher took of teaching both languages at once. I'm one of those people who learned HTML and CSS completely separately, and I had to suffer through unlearning a lot of HTML when I made the switch to CSS-based layouts. This book avoids that problem by teaching you CSS-based layouts from the get go, building upon a solid foundation of semantic XHTML.
If you do end up learning HTML and CSS through this book, I'll be very interested in learning how you liked the integrated teaching approach for the two languages. Contact me or Virginia and let us know!
Posted Friday, January 19, 2007 4:13:08 AM by jojo
You may have noticed the release of the CMX mobile/handheld device CSS reference resource yesterday. With mobile access becoming an increasingly important area of our work. and information in general on CSS support for mobile browsers being scarce we thought it would be good to have an open source mobile reference point, a place where you can search for mobile device/browser information and also add devices to the resource.
When designing for the mobile internet you need to be aware that not all handheld devices' browsers support the handheld media type, many only see the screen media type which means your small screen design needs to be carefully planned out to ensure that you get the display you need. Further to this some handheld browsers read both the screen and handheld media style sheets so you need to be fully aware of the rules of specificity and how to implement them to deal with these browsers correctly.
Don't get caught in a trap where you think just declaring a handheld media type is good enough, it isn't.
You can access the desk top search interface here: http://www.communitymx.com/mobile/mobileD/ For info on handheld browser support you would be best searching for the browser name.
You can add your device to the database for others to reference by visiting here: http://www.communitymx.com/mobile/ this is only accessible by handheld devices though. If you do add your device please complete the CSS reference point checks.
An article on using and how the data collection works is available here: http://www.communitymx.com/content/article.cfm?cid=AA8A9
Look forward to hearing any comments you may have.
Posted Friday, January 05, 2007 9:20:40 AM by Stephanie
Sometimes I get a bit behind on my Community MX reading and have to catch up in one fell swoop. This morning, I was having a look at the past few articles and found a most awesome resource that Sheri German put together. Though we're in the midst of a site redesign (yes, we know it's sometimes tough to find the exact article you want as CMX approaches 1950 articles!) it's not done yet. In the interim, Sheri has compiled the CSS section of the site into a great learning guide that you'll want to keep nearby. It's free, for those that aren't members, and groups articles by subject and gives you an idea of their levels and what to tackle first.
I had to share this one! Design Your Own Custom CMX CSS Course -- a learning resource guide.
Also, in case you missed it, over the holidays Adobe launched a CSS-related beta of their own - CSS Advisor. CSS Advisor is a resource where information on CSS bugs will be compiled by the community with links to their originators and other resources where possible. A kind of all-in-one-place starting point to pinpoint what your bugs might be and find solutions.
Finally, more related to design than CSS, Adobe has another beta you may have missed called Kuler. Kuler is a color blending tool and I must say, it's the best I've seen so far. Create a free account and then, starting with the base color you want, create palettes of analgous, monochromatic, triad, complementary, compound, shades and custom shades. It's very easy to use too since you can either move sliders or use a color wheel with these nice little "arms" you can move around. And, well -- just go play with it, save and share your own custom palettes!
Posted Wednesday, November 08, 2006 8:58:00 PM by Big John
Today our article Newly Supported CSS Selectors in IE7 appeared, and by pure serendipity we got a note all the way from Brazil on this very subject.
Mauricio Samy Silva has created a PHP page that allows you to type advanced compound CSS selectors into a field and see the results live on the same page. Cool! Just what we need to cram those new combinator combinations into our craniums.
Posted Wednesday, August 30, 2006 11:02:26 AM by Gordon Mackay
In my quest to learn how to draw with more skill in Fireworks I think I have found the perfect method. What I have been doing is selecting a simple object to draw on a daily basis.
Some of the things I have been attempting are:
- Simple three dimensional shapes, like cubes and cylinders
- Cartoon faces
- Cartoon penguins :)
- Ugly looking houses :(
These experiments have gone rather well, and through my attempts I have picked up some rather nifty imaging techniques that I will be able to apply to more advanced drawings at a later stage in my development.
I said that the experiments have gone rather well, but unfortunately a lot (maybe most) of them would be embarrassing to show here. So I will stick to presenting you with only the PNG files that I'm most proud of :)
Last night I attempted to draw a flower, one that doesn't actually exist in nature :P I managed to easily get the flower looking pretty darn good, and in turn I felt pretty darn good too. So much so that I got carried away and added some sky, then some clouds, then some more clouds, then some grass and ground to plant my flower in.
The amazing thing about starting off simple is that your highly unlikely to be completely disappointed with the fruits of your labor. In fact, in my case it made me more enthusiastic.
So much so that I don't find this picture embarrassing enough to make me want to hide my face for a year if I show you it:
If you're really serious about designing web sites you should consider learning to draw in Fireworks. It's a lot of fun and it's also a great way to create graphics that are unique to your own designs.
I hope that some of these posts I have been making are enough to whet your appetite.
Have fun :)
Posted Wednesday, August 23, 2006 6:20:36 PM by Gordon Mackay
When I'm bored I sometimes watch TV, I sometimes read a book, but most of the time I switch on my computer and fire-up Fireworks, then iTunes and then start drawing things.
For me boredom generates productivity and ideas. The need to do something during those times normally leads to a PNG with a doodle planted slap-bang in the middle of it.
The images folder on my Mac contains around 500 Fireworks PNG files that consist mainly of random ideas that have poured out of my head and onto a blank canvas. Not all of them are good, and some of them are downright ugly, but that's not the point, the point is that I can go back to them at some time in the future and maybe use them for a project, or for something to tutorialize here at CMX.
Boredom led me to make this post, so I will share with you the product of that boredom.
Here it is:
(Right click to save the PNG to your desktop)
I don't know about you guys, but there is something about penguins (maybe it's a Linux thing, hehe) that makes me happy.
Anyway, please feel free to tear the PNG apart, edit it... use it... do whatever you want with it... just have fun :)
Posted Wednesday, August 16, 2006 7:39:40 PM by Gordon Mackay
One of the things I hate when it comes to design is being forced to use un editable, flattened images in designs, especially when they are icons or symbols.
One of the most commonly used icons on modern blogs is the RSS one that first appeared in the Mozilla Firefox status bar a good few versions ago. It looks like this:
Like most good icons it's very simple, so why use other people's versions of it when it's so easy to recreate in Fireworks. Here's how:
Let's get drawing the icon
Open up Fireworks and create a new 100 pixel by 100 pixel canvas. The reason it's 100 pixels is just to give you enough room to play.
Set the canvas color to black so that it's easier to see what you're doing.
Select the Ellipse Tool () and draw a 40 pixel by 40 pixel circle in the middle of your canvas.
Set the fill to "none", and set the stroke to a 3 pixel soft line. Your circle should look like this:
Now clone the circle you just drew (Edit > Clone) and set it's dimensions to 24 pixels by 24 pixels and position it centrally within the larger circle:
To make our little "RADAR" from these circles we use the Knife Tool () to make two cuts through our circle:
- From the 9 o'clock position right through to the 3 o'clock position
- From the 12 o'clock position through to the 6 o'clock position
To do this select both the circles and and drag the Knife Tool along the same paths as shown in this picture:
Now delete all the excess paths so that you're left with something that looks like this:
Now draw a 10 pixel by 10 pixel solid white circle and position it like this:
Now all that's left is to place a nice orange filled rectangle behind it, and change the canvas color back to white:
That's all there is to it. Feel free to get creative and use different background colors for your rectangle. Here is a PNG that I made (right click to save to your desktop):
Have fun :)
Posted Thursday, August 10, 2006 2:40:28 PM by Heidi Bautista
We published my very first JumpStart today. When I'm not working like a fiend, I love to garden. So I combined my two passions into our latest JumpStart offering: Greenville.
Like all of our JumpStarts, this one is uses valid XHTML 1.0 and CSS 2.1 markup and follows WAI and Section 508 accessibility guidelines
Be sure to check out Sheri's redesign. Besides being a lovely site, it does a great job of showcasing how easy it is to adapt our JumpStarts to your own projects.
I hope you have fun with Greenville!
Posted Thursday, August 03, 2006 7:00:09 PM by Gordon Mackay
I don't know how most other people draw up inspiration for their design work when using Fireworks, but for me it normally begins with a series of basic shapes. Rectangles, squares, polygons, whatever, are the core building blocks of all graphics. You can't do anything without them.
When you start punching holes in those basic shapes, joining their paths, changing their colors, or even just overlapping them, they start to gel together as a more creative formation... then all-of-a-sudden it hits you! BANG!! You have an idea!!
Maybe it's simply because your crazy array of pixels has begun to actually look like something that you could possibly use for a current project, or maybe it's something you could archive in some deep, dark directory on your HDD for future use.
Either way, it's possibly one of the coolest feelings you could have sitting in front of a computer (OK, I have left myself open to some fairly creative comments with that statement :D .)
(This is the method that I have used when creating the Design Elements and JumpStarts here at Community MX.)
Just the other day I was staring at a blank Fireworks canvas, feeling the effects of designer's block and I started pushing random shapes around in the way I just described. Would you like to see what happened on my canvas? Well, here it is, right here.
It's not the coolest of creations, granted, but it could be something I may develop into a bigger “something” in the future, who knows.
While I think that it's important to learn how to use Fireworks' (or whatever graphics package you use) massive library of functions, I still believe that it's more important to play around and get creative without being all technical about it. So think back to when you were a kid, and all you needed to make you happy and creative was a box of crayons and some rag paper, open Fireworks with that feeling fresh in your mind, and get doodling!
PS: This is my first blog post here at CMX, so please be gentle :)
Posted Thursday, July 27, 2006 1:20:30 PM by Zoe Gillenwater
Posted Wednesday, July 12, 2006 1:34:59 PM by Jim Babbage
It has been a while since the merger/aquisition of Macromedia by Adobe and at least from my small place in the world, things seem to be working out rather smoothly. Fireworks lives on, ImageReady has been booted into the dumpster (Boo-yah). Now Adobe can concentrate more on improving Photoshop without resources being siphoned into ImageReady. I may be naive in that regard, but a guy can hope.
Dreamweaver and Flash seem secure in their existence. I don't have a crystal ball (or inside info, either) so it's hard to say how things will change over the next few development cycles, but for now I am content.
I am well aware that CMX subscribers and many other graphics professionals still use both apps, or more. With some, the strength is Fireworks; with others, it is Photoshop and quite likely Illustrator. I really don't think this scenario will change a lot. After all, you use the tools that you are most comfortable with and that do the job in the most efficient manner.
Where I do see a shift is specifically with those web graphics people who were (or are) using Photoshop/ImageReady for graphics work. I can see them leaning - or being led - to the Fireworks side of things.
In the meantime, I have seen the odd post from a subscriber wishing/hoping that our CMX JumpStarts had PSD versions for the graphics.
The creation of a JumpStart is a long, detailed process which goes through multiple edits and revisions to ensure the design and the CSS/html work as efficiently and are as clean as possible. These puppies aren't built overnight, believe me. And at this time, there are many hurdles and acrobatics and workarounds involved in converting a fully editable FW PNG file to a fully editable PS PSD or AI file. Even then, there may still be some slight differences.
Well, hopeful Photoshop users, I have taken it upon myself to make PSD (or where more appropriate, AI) conversions of some of our CMX JumpStarts. In late June, Fireworks to Photoshop - Rebuilding the CMX Vienna JumpStart PNG as a PSD file became available. I've recently completed two others which will be online within the next couple weeks.
This process is hit and miss; I don't know if I will be able to convert all of them. But as the months progress, you will see more of these conversions made available. Each article included the editable PSD or Ai file and covers any pesky little conversion soluitons I had to go through. I don't repeat information that was dealt with in previous articles, but I try to mention where you would find the information in my other articles.
Keep in mind, these are NOT complete JumpStarts; they are only the main PNG file. If you want all bundled articles and CSS information, you would need to purchase/download the original JumpStart.
I hope that you find these articles interesting and useful. I'm certainly learning a thing or two as I go.