Archive for January, 2011
The Miseducation of the Doodle
CSS3 Tutorials to Brighten Up Your Day
 |
As we all know, a lot of complicated CSS code snippets had to be used back then when you simply wanted to achieve a rounded corner, and even had to use JavaScript for simple animations. But since the coming out of CSS3, life has become a lot easier.
In this post we provide you with a great collection you can always turn back to; whether you’re a pro and haven’t seen that particular tutorial yet, or a beginner who has newly discovered their love for CSS3. Either way, please feel free to mention tutorials that were missed out and would like to share with others.
Awesome Cufonized Fly-out Menu with jQuery and CSS3
In this tutorial you can learn how to create a full page cufonized menu that has two nice features:
Subtle CSS3 Typography That You’d Swear was Made in Photoshop
Thanks to text shadows, outlines, transitions, and even text gradients, we can now create cool typography that you’d swear had to be made with a program like Photoshop. Nope, all CSS3 baby!
CSS3 Minimalistic Navigation Menu
Here is a simple CSS3 animated navigation menu, which degrades gracefully in older browsers and is future-proofed to work with the next generation of browsers:
CSS3 Background-Clip: Text
To carry out the DIN typeface, a transparent PNG with letters was used to achieve that subtle yellow to blue fade animation: Click on the image to read more:
Create a Vibrant Digital Poster Design with CSS3
Follow this walkthrough of the making of Circlicious — a vibrant and abstract digital poster design made purely of HTML and CSS:
How to create a kick-ass CSS3 progress bar
In this tutorial you can learn how to create a fancy progress bar using CSS3 and jQuery, without using Flash or even images:
Colourful Rating System
In this tutorial you are going to follow a relatively simple jQuery tutorial. Rating systems are used on a lot on websites, for example on how to rate a certain product, article or comment:
Create Animated Price Grid Using CSS3
In this tutorial, an animated Price grid will be created with only the help of CSS3. No jQuery, No Images, No Flash at all:
Related Posts Slide Out Boxes with jQuery and CSS3
In this tutorial, a fixed list is created at the right side of the screen with some thumbnails sticking out:
Halftone Navigation Menu with jQuery & CSS3
In this tutorial you will find out how to create a CSS3 and jQuery halftone-style navigation menu, which will allow you to display animated halftone-style shapes in accordance with the navigation links:
How to Create A Multi-Step Signup Form With CSS3 and jQuery
In this tutorial, a simple multi-step signup form using CSS3 and jQuery will be created. To spice things up a bit, we will include a progress bar with the form, so the users will be able to see the percentage of form completion:
Coding a Rotating Image Slideshow w/ CSS3 and jQuery
In this tutorial you are going to use jQuery and CSS3 rotations, along with the jQuery rotate plugin, to create a beautiful slideshow:
Animated Navigation Menu with CSS3
In this tutorial you will be shown how to create an animated navigation menu with CSS3:
Create Ajax Loading Animation with CSS3
Normally, frontend developers use GIF animations for Ajax data loading. But now CSS3 animation properties allow us to achieve the same Ajax loading animation effect, without GIF animation required:
Slick CSS3 Animated Image Caption
This is an experiment to create an animated image caption. You might have seen enough of this effect all over the web, but here we’re trying to achieve the same effect using CSS3 Transitions:
Create Animated Landscape using Pure CSS3
In this tutorial you’ll see how you can create a landscape effect with pure CSS3 technology:
Sticky Notes with CSS3
In thios tutorial you can see how sticky notes with CSS3 can be created:
How To Create a Sexy Vertical Sliding Panel Using jQuery and CSS3
In this tutorial you can find out how to create a sexy vertical sliding panel using jQuery and CSS3:
Display Social Icons in a Beautiful Way Using CSS3
The goal here was to slowly fade-in and fade-out the opacity changing, and animate the position of the tooltip a little bit:
Animated Wicked CSS3 3D Bar Chart
In this tutorial you can learn how to create a beautiful 3D bar chart::
3D Animation Using Pure CSS3
The perspective property is what we need to create the 3D effect. Using transform and transition, we can create 3D animations using pure CSS3:
Cross-Browser Rounded Buttons with CSS3 and jQuery
In this tutorial, a cross-browser with rounded buttons will be created with the help of CSS3 and jQuery:
Slide Down Box Menu with jQuery and CSS3
In this tutorial, a unique sliding box navigation is created. The idea is to make a box with the menu item slide out, while a thumbnail pops up:
Beautiful Photo Stack Gallery with jQuery and CSS3
In this tutorial you can learn how to create a nice and fresh image gallery. The idea is to show the albums as a slider, and when an album is chosen, the images of that album are shown as a beautiful photo stack:
How To Change Default Text Selection Colour
Whilst this CSS3 declaration might not be crucial to your project or design and yes it is not supported by all browsers, but it is a fantastic effect that really takes your design one step further:
Making Better Select Elements with jQuery and CSS3
Here you can find out how to build a script, one which is going to take an ordinary ‘select’ element, and replace it with a better looking, markup powered version, while keeping all the functionality intact:
CSS3 Animated Bubble Buttons
Here is a useful set of animated buttons created with the power of CSS3s multiple backgrounds and animations. No JavaScript necessary:
BounceBox Notification Plugin with jQuery & CSS3
In this tutorial you will find out how a bouncebox notification plugin can be created with jQuery & CSS3:
Use CSS3 to Create a Dynamic Stack of Index Cards
In this tutorial you can learn how to create a dynamic stack of index cards solely with the help of HTML and CSS3 features:
Interactive Image Vamp up with jQuery, CSS3 and PHP
In this tutorial, an online application for giving some funny touches to an image is created. jQuery, jQuery UI and PHP are needed:
Contextual Slideout Tips with jQuery & CSS3
Knowing the importance of HTML standards, here is a set of contextual slideout tips with jQuery & CSS3 which are ideal for product pages and online tours:
Carbon Fiber Signup Form with PHP, jQuery and CSS3
In this tutorial you can see how you can make a carbon fiber signup form using PHP, jQuery and CSS3:
Sexy Image Effects Similar to Flash – in Pure CSS3
Here is a very different image effect that can be achieved by not only using Flash but also CSS3:
Awesome Buttons using CSS3
Here you can check out a new look to Buttons that can be adjusted in CSS3:
Getting Clever with CSS3 Shadows
As soon as we detach a shadow from the element, itself, we can then transform the shadow in interesting and creative ways. Click on the image to find out more:
How to Build a Kick-Butt CSS3 Mega Drop-Down Menu
In this tutorial you can learn how to build a cross-browser with an awesome CSS-only drop-down mega menu, using nice CSS3 features:
Flexible, Mobile-First Layouts with CSS3
CSS3 provides a fairly rich toolset for mobile-friendly formatting, relying on the client’s browser capabilities instead of back-end templating:
CSS3 Slideup Boxes
Follow along and see how we can use a few very simple CSS3 transitions to create a “slideup” box effect:
How to Create a Drop-down Nav Menu with HTML5, CSS3 and jQuery
In this tutorial you can take a look and see what can be achieved with the help of HTML5 and CSS3 as well as some jQuery:
Fancy Image Hover Using CSS3
In this tutorial you can learn how to create a fancy image hover with CSS3. As you all know, we can have cool image hover effects using jQuery. By using transform and transition properties of CSS3 we can have an even better effect:
CSS3 Dropdown Menu
Here is a Mac-like multi-level dropdown menu that can be created using border-radius, box-shadow and text-shadow:
Fun with CSS3 and Mootools
These examples came about when experimenting with the ‘extend’ property in MooTools:
Colorful Sliders with jQuery & CSS3
In this tutorial you can learn how to use jQuery and the new transformation features brought to you by CSS3 to create a three dimensional dynamic slider effect:
Coding a CSS3 & HTML5 One-Page Website Template
In this tutorial you are going to make a HTML5 web template by using some of the new features brought to you by CSS3, jQuery and the ‘ScrollTo’ plug-in:
Create a Yoyo with jQuery and CSS3
Here you can learn how to create your own yoyo with the help of CSS3 and jQuery:
How to Create Depth and Nice 3D Ribbons Only Using CSS3
In this tutorial you can learn how to create nice 3D ribbons with the help of CSS3 only:
Create a Fancy Web Form with Field Hints Using Only CSS3
Here you’ll be shown how to create a fancy web form with field hints using only CSS3:
Pure CSS Social Media Icons
This is an experiment that creates social media icons using CSS and semantic HTML:
Build a Simple Portfolio Image Gallery with CSS3
Here’s how you can use CSS3 to create a Javascript-free gallery that enlarges your images on hover:
Create Beautiful CSS3 Typography
In this tutorial, you will find out how to take basic markup and transform it into an attractive and beautiful typographical design through pure CSS3:
Old School Clock with CSS3 and jQuery
Here is an interesting tutorial on how to create an old school clock with the help of jQuery and CSS3 features:
Build Awesome Practical CSS3 Buttons
Here is a video tutorial that will show you how to build some awesome practical CSS3 buttons:
(ik)
Guidelines for Successful Communication With Clients
|
OK, so this is a yet another article about dealing with clients. But let’s face it — it doesn’t matter how well you can design or code; as a freelancer or if you’re running a digital agency, if you don’t get the client management right, it can spell disaster for your business. By getting it right from the very beginning, you’ll most likely see things flourish.
In a previous article on How to Explain to Clients they are Wrong, I discussed one aspect of client management, but oh my, there are so many and that is why I would like to discuss yet another aspect in this article: how to maintain project productivity and momentum when working with clients.
A Common Scenario
Most of us have been there: we’re working on a project for a client, we plan it, we set down a timeline with milestones and everyone is happy. We then complete our first task that requires feedback and wait for the response on the date mutually agreed, one that would keep the project on schedule… and then it happens. The response doesn’t come, or it does, and it in no way helps the project along. In fact, it actually makes you want to go and hibernate for a few months in a warm safe place and put the client into carbon freeze.
“The Infinite Chase” of pleasing the client by Tommaso Meli, adapted by SM Editorial Team (Large view is NSFW)
So what can you do to help avoid these Web project crimes? Hopefully, the following tips can save you some stress and ensure that you aren’t completely grey haired by your mid-twenties.
Regular Schedule and Budget Updates
It seems like an obvious one, and something many of us start out doing at the beginning of a Web project, but as the workload builds up and other projects on your plate are starting or ending, it can often fall by the wayside. This might not seem to be a problem in the short run, but it will become one the minute something doesn’t go according to plan.
From the very beginning it’s really important to remain disciplined and send your client a revised project schedule and updated budget every week. In this update you could highlight the following:
- Completed tasks from the previous week.
- Budget spent and budget remaining on each phase, e.g. design, functional specification etc.
- Planned tasks for the following week and who is responsible, you or the client.
- Any tasks that are slipping over schedule or over budget, and if so why. Also consider the potential impact on the project.
It may seem a little over the top to do this the week after the project starts, as very little has changed from the initial schedule; but as the project progresses and things inevitably slip, it’s in no way a surprise to the client and makes negotiating additional time or budget a lot less painful.
Buy Now, Don’t Pay Later
Too often I see people running web projects that don’t send weekly schedules and budget updates with it invariably ending up the same way — the project slipping in various places, small places, but building into significant schedule and budget problems over time. Then, after a few months, the client suddenly asks “Are we on track for go-live?” or “Are we on budget?”
This is when the smelly stuff hits the fan as the client, quite rightly, says “I assumed all was OK as you hadn’t mentioned anything before!” Not only do you have to fumble your way through an awkward phone call or meeting but you’ve put yourself in a weak position and damage has been done to your relationship with the client and their level of trust in you. Bad times, and all because you weren’t disciplined and clear from day one.
The Client is a Team Member
Constantly highlighting tasks that need attention by a certain date from a client, with the impact of non-action being clear, really helps keep the client focused on completing what they need to do in the short-term. At the same time, it helps you maintain the bigger picture view of the project — after all, clients inevitably have a business to run and so your job is to make things as simple for them as possible by essentially managing them and their project tasks as if they were a team member. Oddly enough, in my experience, most clients actually appreciate you managing them.
From the initial stage of the project, it is a good idea to make it clear to the clients that you see them as a team member of the project and expect cooperation and support during the entire project. This also means that you should expect to have a dedicated person in the client’s company who will be answering your questions, and who will be the only person answering your questions. This will help a lot during the whole process and will prevent problems and misunderstandings down the road.
Shifts In Schedule Aren’t Always Bad
Slipping project schedules are often associated with a project going wrong, but it doesn’t always have to be. Remember, an initial go-live date set out in an initial schedule isn’t always as important as the client has said it is. Sometimes other more important things pop up, and these things often need to be carefully examined, discussed, resolved and implemented — and often it just takes more time than expected.
Have your Plan B prepared… Image by Tommaso Meli
If a project you’re running is in danger of missing milestone dates due to lack of timely client feedback, as long as you have constantly communicated impact of late feedback you can always approach the subject of a new go-live or milestone completion date with the client and see how it plays out. Argue that the quality of your work is very important to you and you wouldn’t want to compromise the quality of the project due to the communication problems. It’s a good idea to find time to review the work done, discuss the problems in communication and find solutions to improve the workflow in the next stage of the project.
The more important the deadline is to the client, the clearer your time requirements and feedback requirements should be in the initial stage of the project.
In my work, I find myself often starting a conversation along these lines expecting “the go-live date is fixed” reply, but instead got a more reasonable response if the client has been given regular updates and knows that the main reasons for the delay are not design agency’s lack of discipline, but rather company’s late feedback or other reasonable problems. Give it a go: you may be pleasantly surprised at the power of disciplined and honest regular updates.
Help the Client Out, Be Pro-active
This is an important point: always be willing to help the client out with tasks that you shouldn’t necessarily be doing or are being paid to do. Common examples of this include microcopy, icons, print version of the website, small teaser images and lower level page banners.
A hard-nosed stubborn Web Project Manager will insist that all images and copy, including the little bits and pieces like thank you e-mail copy and success messages, are delivered by a date in order to remain on schedule, and when these aren’t delivered, then the project could well be delivered late and it’s all the fault of the client. Well, maybe it is, but do we actually have to wait for the client for every single bit of the project?
You know the business, let your client know! Image by Kyle van Horn
You use the Web every single day, you’re a Web professional, you know the project inside out and you’ve learn about the target audience from the meetings with clients. This knowledge enables you to assist the client when timelines are slipping by, getting these small things created for them if necessary.
Now of course in an ideal world all of these elements would be paid for and carefully crafted by designers, UX teams and copywriters, but this is just not the way it usually works in practice. Sometimes commercial reality for both your business and the client must take precedent and it’s time to roll your sleeves up.
Get Real, Get Commercial
For the sake of keeping a project worth thousands on track, and if you are sensing these could be stalling points, go ahead and pre-empt the delay in getting the smaller things on time by preparing some example pieces of microcopy and submitting to the client for approval. Yes, I hear you, it’s not your job to do, but if you want to save the project, sometimes it’s your responsibility to take care of it in a reasonable, professional way. Or how about producing a lovely content template spreadsheet for the client to fill in rather than asking them to work on a blank canvas (if you can call MS Word a canvas).
Clear it with your boss that by getting a designer or copywriter to work for a couple of hours unbillable will keep a project and cash flow on target — rarely will the request be denied and the client will probably really appreciate you taking the lead on things that, to them and their business plan, are small details.
As long as the time you spend helping the client out balances out financially in the long-term, it’s always a perfectly good solution to keeping a project on track when necessary and encourages a positive relationship with the client.
Dealing With Multiple Stakeholders
Often when working for a client, you only interact with one or two persons but they have to report to many more. A common cause for delays in web projects is the time it takes your primary contact to get their superiors to review, provide feedback or approve portions of work and communicate this back to you.
With the best will in the world from all parties this can be incredibly frustrating and the time to get the feedback you need isn’t always easy to do with communication lines. It can also be because your primary contact will encounter not only “design by committee” but also “decision by committee”, on the smallest of things. The good news is that there are ways to combat this.
Identify The Client-side Project Manager
First of all, it’s a good idea to make sure you ask who will be the client-side Project Manager and if this person has decision making authority as early as possible in the project, preferably at the kick-off meeting. In some situations, especially in boardrooms with Senior Directors, plus your contact sitting there, this can feel like an awkward question to ask but it’s vitally important to do so.
Of course, the Directors will identify your contact as the Project Manager their end, but if they hesitate on confirming that they have decision making authority, quickly but calmly communicate that it’s not a problem and you’ll just have to work decision making time into the timeline. Although this is a bit of a fluffy statement, it sets you up to raise it at a later date if it becomes an issue with regards to timelines and also gives your contact some leverage when pushing their probably very busy bosses for timely feedback.
Make Your Primary Contact Look Good
Another piece of client management advice that is very helpful for facilitating a smooth project, is to always do your best to make your primary contact look good to their superiors — even if the primary contact made some mistakes or doesn’t communicate things clearly enough.
What this means is that regardless of what calibre your primary contact is regarding running things from their side, always try to hit their deadlines, allow them to take credit for your suggestions and ideas (within reason) and just generally give them the best service you can. This isn’t just a good, ethical and worthwhile approach to providing a service, but if you make your primary contact look good to their superiors, they will absolutely love you for it. Consequently, they will put more effort into keeping the relationship fruitful by making things smooth for you and ultimately want to keep working with you rather than someone else. And that’s a project productivity win and long-term client relationship win as well.
Don’t let your concept go up in flames. Image by Tomasso Meli
When You Just Can’t Roll A Contact In Glitter
In the absolute worst case scenario it may be necessary to consider going above the primary contact’s head, to their boss, in order to get things moving again or increase the speed of feedback. But use this approach with massive amounts of caution! Obviously, it has the potential to permanently damage the relationship you have with the client, including their boss, and while they may begin to provide feedback quicker, some more unscrupulous clients will make sure to cause you stress and grief in other ways as punishment and revenge, and even nice ones will be really annoyed to say the least.
The only reasonable advice in such situation is to ask the design agency’s head to call the company and insist on sorting things out to keep the project’s flow as smooth as possible and avoid problems down the road. However, this should certainly be the last resort.
If you work for a company, you can be certain that somebody senior will be able to strike up a conversation with someone senior on the client side and approach the subject in a much more subtle way than you could, if you can leave that to the silver tongues of the world.
If you’re a freelancer, then, well, you’re in a really tough position and it’s a good idea to try to somehow manufacture a reason you need to speak to the someone senior and very gently sway the conversation to how the project is going, and ease into the part of the conversation that explains how busy they all must be, how everything’s going fine and if one improvement could be made then it would be response time on certain aspects…
If this technique sounds a little fluffy and a bit underhand, that’s because there is definitely no single right way to do it, and it does feel a little wrong. But if executed the right way it can have the effect desired with no egos bruised.
Face-to-Face Sessions And Meetings
When you encounter a client that just seems impossible to get timely responses from, it’s usually not because they are unprofessional, but rather because of their own personal hectic schedule of internal work which is constantly winning their attention over this ‘outsourced’ project.
One approach you can take when the list of responses and decisions you’re waiting for are just not coming, is to arrange the ultimate solution to the problem — a face to face client session or meeting.
Session And Meeting Management
The truth of the matter is that some clients you literally need to drag into your office and not let them leave until you have all the feedback and decisions you need. More often than not these sessions can be incredibly productive and get a stalled project right back on track.
When having a face to face meeting session with a client to get a project back on track, it’s important to clearly define the reason for the meeting and provide clients with enough time to prepare everything they need beforehand. It’s crucial to maintain focus on this main goal during the meeting and not let it get sidetracked by any other business. So if the conversation suddenly veers off course, make sure to pick your moment and reign it back in, perhaps by noting down the topic or question and postponing the other topic after you’ve got to the end of the agenda.
Weekly Client Meetings
Another meeting-based solution to help with client and project productivity is to arrange weekly client meetings. It’s not necessary to arrange them face to face but personally I’ve found these more effective than phone calls.
Admittedly, not all weekly meetings are good. To avoid getting caught in the hellish, lengthy, counter-productive weekly meetings, start them with a strong statement: encourage all participants to keep focused. Set a specific timeframe for the meetings to make sure that they are not taking too much time: usually 25–40 minutes is more than enough to discuss the most critical things that require clarification.
When I first came across the concept of weekly meetings, or having a focused call with a client, I felt that it just wasn’t worth it and would take a lot of work time that could rather be used for more productive and meaningful work. I assumed that an hour each week would feel very much like in every other meeting I’d been at and hence result in few decisions and more questions than answers. I must admit that I was wrong.
Conclusion and Delusion: Some meetings just don’t help. Image by Tommaso Meli
If handled correctly with strong focus on being efficient and to the point, a weekly meeting or call can be incredibly beneficial to a project’s momentum, and for very simple reasons. They:
- Increase the project’s perceived importance in your and your agency’s field of vision.
- Reduce the temptation to delay something on that project for the sake of another as you’ll have to report on progress in less than a week, e.g. schedule and budget updates.
- Allow for a constant flow of review and decision making at regular intervals, hence making planning easier.
- Rapidly encourage a good working rapport with a client making things easier for both sides.
Overall, the main benefit of weekly meetings, and probably the reason I initially resisted them so much, is that they actually keep the pressure on to complete a project and stick to the project plan. And that’s a damn good thing. Once I saw the difference in how quick a project with effective weekly meetings was delivered over one that was allowed to be delayed due to the lack of regular communication, I embraced them and found myself zipping through projects quickly.
It’s Not Always the Client That’s the Bottleneck!
Despite it’s often very comfortable to criticize the client for delays (and it is sometimes very true and therapeutic), it’s often not the client that holds up a project. Keep your worklfow organized and review your internal processes every month, trying to find bottlenecks and improve the flow of your projects. Criticize yourself first and never criticize your clients. Mutual respect and honesty is much more helpful than putting labels on things; be professional and make sure that your work is always professional as well.
Non-Diagnosed Medical Conditions Help
One obvious way to ensure that you don’t become the bottleneck in a project is to be so organized that if a medical professional were to observe you for a week they would most likely prescribe you pills and a psychiatrist for obsessive behaviour.
Being organised is a discipline but, in my humble opinion, also a character trait that can’t be taught easily. You either are an organized person or you’re not. While everyone can’t be built the same way, if you want to maintain productivity on a project, you need to find some mechanism to keep things in flow and on track. Use simple tools and use them well. For instance, sometimes a simple .txt-file is more than enough for keeping deadlines and managing to-do lists.
So what are the important things you can do to to get more organized?
- Delegate tasks if you have someone to delegate to, even ones you enjoy.
- Seek support from your superior if you’re overwhelmed with work — they’ll help you prioritize.
- Try using a workload management system such as GTD or Pomodoro.
- Review your project schedules daily, adjust them and communicate them to the client.
- Review your to-do list daily and shuffle things around to create a realistic completion list for the day.
- Avoid dealing with ad hoc requests the minute they come in, often they’re not as urgent as they seem.
- Have a consistent project folder structure and file naming convention.
- Follow consistent processes, so you get better at estimating how long similar tasks in the future will take: e.g. creating a proposal or functional specification which are dependent on size of the project.
- Get a great pair of headphones and listen to the music you love, e.g. the Star Wars soundtrack (or Predator soundtrack if you fancy something a little fruity).
Get to the chopper!
Had A Bad Week? Be Honest About It
If you’ve done everything you could, but just can’t keep on top of things and a project is slipping slightly, just be honest with the clients and tell them you’ve had “one of those weeks”.
Clients are more approachable and understanding than you might think. If you sincerely tell a client the reason for the delay, they will completely understand; be professional and make sure to provide clients with a new (realistic) deadline when you will deliver for sure and stick to it.
Failing to deliver a second or even third time is a pretty good sign to a client that they may have hired the wrong person. More importantly, it should be an alarm bell for you: your way of working isn’t working, be it by not being organized, being too optimistic with deadlines or just taking on too much work. Analyze the problem and adjust your workflow appropriately. That’s your wake-up call that you need to change something. And if you react quickly, you’ll grow as a professional and will be able to keep your current project.
What tips do you have for maintaining productivity on web projects when working with clients?
Related Posts
- Relly Annett-Baker at @media 2010 on Microcopy
- Organization Tips For Web Designers
- 7 Productivity Tips, Plus Tools for Freelancers and Web Workers
- 37 Productivity Tips for Working From Anywhere
- How to Keep Your Web Design Clients Happy
- 11 Ways to Prevent Angry Clients from Destroying Your Project
- When Clients Mess Things Up
- GTD for Web Project Management
- 10 Productivity Tips That Work Surprisingly Well
- 6 Amazing Techniques to Staying Happy During a Stressful Project
(sp) (vf) (ik)
© Sam Barnes for Smashing Magazine, 2011. | Permalink | Post a comment | Smashing Shop | Smashing Network | About Us
Post tags:
Creative and Artistic Poster Designs
|
|
For most designers, it can be difficult to find inspiration by doing quite the same tasks within daily ongoing projects. Going for a walk to catch some fresh air, reading an interesting book or simply going to the cinema can sometimes be helpful. Believe it or not, even that film poster can give you that kick of inspiration — not to mention the movie itself.
From vector posters to retro-inspired ones — all of these have been designed by creative artists who share their inspiring artwork with the entire world. Here is a roundup of only a few of so many really creative and artistic poster designs. Let the creativity begin!
Vector Posters
Sound Idea Presentation Cover Page
Minimalist Posters
Scar Tissue – Red Hot Chili Peppers
Retro-Inspired Posters
Promotional posters for a video games event
Typography Posters
We’re Out Looking For Astronauts
Movie Posters
Useful Resources
- 40 Exquisite Independent Film Posters
- 26 Inspirational Vector Posters from Creattica
- 30 Inspiring Poster Designs
- 30+ Creative and Inspiring Poster Designs
- 50+ High-impact Illustrated Vector Posters
- 25+ Photoshop Tutorials for Poster Design
- Amazing Poster Design
(ik)
The HTML5 Logo: What Do You Think?
|
This has been an interesting week for web design community, to say the least. The W3C revealed a new HTML5 logo to help designers and developers ‘tell the world’ that they’re using HTML5.
The logo was designed by Ocupop, a U.S.-based design agency, and it’s licensed under Creative Commons Attribution 3.0, a permissive license that allows ‘remixing’ of the licensed work. The logo has been made available on stickers and t-shirts, and there’s a gallery already promoting examples of the logo in use.
The logo’s official site includes a “badge builder� that customizes its orientation and allows you to add supplementary icons to indicate support for the different technologies that have become associated with HTML5.
According to the W3C Blog, the purpose of the logo is as follows:
We intend for it to be an all-purpose banner for HTML5, CSS, SVG, WOFF, and other technologies that constitute an open web platform. The logo does not have a specific meaning; it is not meant to imply conformance or validity, for example. The logo represents “the Web platform” in a very general sense.
That all-encompassing definition has met with some opposition from Jeremy Keith. According to Keith, while he does approve of the logo’s design, he disagrees with the blurring of the lines that separate the web technologies that the logo is supposed to represent. Keith doesn’t have a problem with the media using the term “HTML5″ to cover this broad area, but he feels it’s not appropriate to push this kind of terminology in the web development industry.
In support of the definition, Ocupop Creative Director Michael Nieling said in a statement that “HTML5 needs a consistent, standardized visual vocabulary to serve as a framework for conversations, presentations, and explanations.�
Keith’s concerns are valid. The logo will certainly strengthen the awareness of HTML5 (which is something we all want), but it’s difficult to accept that something like WOFF, which is a web font format and has nothing to do with the HTML5 spec, will fall under the “HTML5″ umbrella. Similarly, CSS3 does not belong in that scope. But interestingly, you’ll notice in that quote from the W3C blog post that the “all-purpose banner” includes “CSS” — so it’s not just CSS3, it’s all of CSS. I can’t see many people being too happy about this.
And if that wasn’t enough, before the web design community had a chance to exhale, the WHATWG Blog published a post entitled “HTML is the new HTML5″, announcing two changes: (1) The HTML specification will be known simply as “HTMLâ€� (dropping the “5â€�); and (2) The spec will be considered a “living standardâ€�, not just a draft, dropping use of the “snapshotâ€� model of development.
What Do You Think?
This article doesn’t intend to offer too much of an opinion on these matters, as it’s still early. But we know many in the industry want to voice their thoughts, so we’re encouraging you to offer your comments on the logo, its stated purpose, and the further developments on the term “HTML5� announced on the WHATWG blog. It certainly has been an important week in web development, so we’d love to get your thoughts on all of this.
© Louis Lazaris for Smashing Magazine, 2011. | Permalink | Post a comment | Add to del.icio.us | Digg this | Stumble on StumbleUpon! | Tweet it! | Submit to Reddit | Forum Smashing Magazine
Post tags: