Subscribe Now!
...with web-based news readers. Click your choice below:
...with other readers:
FeedBurner makes it easy to receive content updates in My Yahoo!, Newsgator, Bloglines, and other news readers.
Learn more about syndication and FeedBurner...
Current Feed Content
-
3 Tips for Creating a Effective User Flow
Posted:Wed, 16 Jan 2019 10:45:43 +0000
The purpose of almost every web design is to entice customers into buying your products, or subscribing to your services. However, your website can’t accomplish that goal without providing a superior user experience, which is largely defined by a great user flow.User flow refers to a series of steps that will help your prospects interact with your website without any distractions or hindrances. Thus, it improves your conversion funnel and reduces the bounce rate. The better the user flow is, the higher the sales conversions will be.
However, designing a great user flow is easier said than done. It is a complicated process that involves creating and evaluating different stages. However, if you keep a few things in mind, you can enable a superior user flow quickly.
1. Know Thy Customers
When you build a user flow, the first thing you should think about is your customers. In-depth understanding of the target audience is fundamental to creating a well-defined user flow. If you know what solutions they expect from you, designing a suitable user flow is a lot easier. It will allow you to design a perspective similar to your users, resulting in higher conversions. This is why you need to create user personas as well as map out customer journey of your prospects.
Creating Buyer Personas
You can think of user personas as a set of characteristics that define the majority of your potential users. These are not fictional guesses. Naturally, creating buyer personas involves a lot of qualitative and quantitative research. You need to study and recognize behavior patterns, goals, skills, attitudes, and background information about your customers.
Collect as much information about your users as possible
Collect as much information about your users as possible. Make sure your user persona focuses on the present. You must know how the users are interacting with your product right now, and not speculate on how they will do so in the future.
You should also tie every characteristic of your buyer persona to real data. You can create more than one persona. In such a case, however, you will need to prioritize them as the primary (most relevant) and secondary personas. You will also need to design different user flows for each persona.
Mapping User Journeys
The next critical aspect of knowing your customers is mapping their journey. A user journey is a timeline of user actions that will show you different touch points between the customers and your website. It allows you to understand how users interact with your site and what you can do to improve this engagement. For example, you may be able to find that removing or realigning a particular stage from the journey can improve your conversions.
It usually consists of personas, timelines, touch points, and engagement channels. Detailed customer personas will allow you to identify the trigger points or problems of your consumers. The timeline determines how long the journey will take, while touch points are the stages where users will interact or take specific actions such as registering for your email list.
Engagement channels are nothing but various ways to interact with your customers such as sending promotional emails, text messaging or online chatting. However, a customer journey map will largely depend on your market niche and customer personas.
Identify the Entry Points
In addition to the user personas and buyer journey, you also need to know the various entry points. Entry points are the way your potential customers reach your website. Usually, they will get to your site through one of the following entry points.
- Directly typing the web address of your site.
- Through social media sites such as Facebook and Instagram. They will click on the links provided in your promotional content to reach your site.
- Through organic search (or pay-per-click ads if you are running a PPC campaign) by typing the search queries in search engines such as Google or Bing.
- Through advertisements and referrals on other websites, online forums, and blogging sites.
- Via email links sent in your promotional emails or monthly newsletters.
Knowing these entry points is crucial because they will affect your user flow. For example, a user coming to your site by clicking a link in a promotional email is likely to be a recurring customer. This user is more interested in availing a specific offer mentioned in the email rather than exploring your site.
On the other hand, someone coming through organic search or social media promotion is more likely to be a first-time visitor. So, they will browse your site for a while and try to find out more about your business before taking any action. They will have a longer user flow with several micro-interactions compared to a returning customer.
2. Avoid Overwhelming Users with Too Much Content
In their attempt to engage users, UX designers often end up creating user flows that are overflowing with content. Unfortunately, this creates the opposite effect. Overwhelming content or features are more likely to distract or frustrate users, resulting in increased bounce rate.
Scrape off Excess Content
Whether it is excessive content or UI elements, you need to minimize as many visual distractions as possible. They are not only unnecessary, but also unattractive. So, make sure to remove all the excessive content, graphics, animations, flashy text, and flickering logos. In other words, you need to embrace simplicity.
If possible, go for a minimalist design. Most static and service-oriented websites can use a minimalist approach to design simple, yet remarkably attractive user flows for their websites. Create site layouts with only the essential elements. Use a balanced mix of images, text and other features that compliment your user flow.
Shorten the Number of Features and Options
A minimalist design also works for various features or options on your website. You need to minimize the features or choices on your site. Too many choices can lead to decision paralysis. Always make sure to provide clear-cut choices that will lead to a specific action.
The easiest way to make that happen is to create the right Calls-To-Action (CTAs) and place them suitably on your site. For example, if the primary goal is to increase your email list, your CTA should focus on asking your prospects to share their email ID with you. You can tempt them with a discount coupon for their next purchase or entice them with a monthly newsletter.
3. Create and Test Your Prototypes
Once you have a firm outline for the user flow, it is time to create different prototypes and test them. A prototype is the tangible variant of your site’s user flow. It will allow you to troubleshoot potential issues before the actual design is built, saving time and money.
Test Your Prototype with Real Users
It is always better to test your user flow prototype with real users. You can use a small group of your target audience (that matches your buyer persona) for testing. Create as many prototypes as you need. Ask this group to check out your prototype and find out what actions they take. Encourage them to provide honest feedback.
It is always better to test your user flow prototype with real users
Once you have their feedback, try to address the bottlenecks and areas of frustration using A/B testing. You can provide more than one alternative to fix a specific issue. A/B testing will help you choose the best possible solution with certainty.
Of course, getting real customers involved in prototype testing is expensive. However, consider this as an investment in building a website with high sales conversions. Alternatively, you can also hire a UX expert to find out potential issues with your existing user flow. It will be less expensive, but may not be as comprehensive as testing with real customers.
Keep Optimizing
Creating a user flow is an ongoing process. Consumers will use new entry points, your competitors will incorporate better user flow elements, and the web will also keep evolving. You will also need to keep optimizing your user flow regularly to stay relevant to these changes.
You can ask your user the following questions:
- What do they love about your site? Is there something unique that encourages them to keep coming back?
- Which is the most attractive feature of your site and why?
- Which part of the site do they find unattractive?
- What else would they recommend your website should have?
- Finally, how will they rate their user experience (or shopping experience)?
Take this feedback into account when updating your user flow. For example, you can try to change the unattractive elements on your site based on the customer feedback and see if the changes can improve your sales.
Parting Words
User flow and user experience are closely interlinked. If you improve user flow, user experience is also elevated. But, before you set out to design the user flow, make sure to go through these three points. They will help you to prepare for a major user flow overhaul of your website. Once you know what needs to be built, nothing can stop you from attracting your prospects.
Featured image via Unsplash.
Add Realistic Chalk and Sketch Lettering Effects with Sketch’it – only $5!
Source -
Grow Your Design Business with Lead Magnets
Posted:Tue, 15 Jan 2019 10:45:03 +0000
All of the work you do to grow your web design business requires an investment of time and energy. And if you do this song-and-dance routine for long enough, you’re bound to become exhausted by it all.So, how do you stop doing so much without losing momentum?
Productivity tools help quite a bit as do templates — be they for managing projects, clients, or to streamline your design work. In other words, anything you can do to automate, delegate, or outsource work completely can reduce how much work you have to do without cutting too much into your profits.
But then there are still those pesky business management activities that require your involvement. Proposal development. Invoicing. Client onboarding. Marketing. And, on top of all that, you have to look for new clients.
Or do you?
If you’re not familiar with lead magnets and how they can improve your client search efforts, it’s time you became acquainted with them.
What Are Lead Magnets?
As a web designer, you instill trust in your clients by providing a quality service. But have you ever thought about how you could turn trust into a profitable long-term relationship with clients?
Lead magnets are one of the best ways to do this.
In summary, a lead magnet is something that you give away for free on your website, that is immensely valuable to clients. In exchange, you get their email address.
Why Would Web Designers Want to Use Lead Magnets?
If you’re feeling overworked and wishing there were an easier way to grow your web design business, pay close attention to these five benefits:
- It’s easy for designers. Because you’re already equipped with a great set of design skills, creating lead magnets will be easy for you (unlike other professionals who usually have to pay others to do it for them).
- It’s passive lead generation. Hunting for clients online is time-intensive and tedious. Lead magnets lure prospective clients to your site and help sell them on your services.
- List building is automated. You know you need to stay in touch with prospects by email if you want to foster them to conversion. With a lead magnet, you don’t have to deal with the hassle of creating your lead list. Everything is automated.
- It makes your business memorable. You’re now not just the guy or gal who designed that amazing website for Company X. You’re the full-fledged web design business that provided a prospective client with a valuable tool that improves how they do business.
- The ROI is huge. A lead magnet is something you only have to create once. Aside from promoting it on your marketing channels, you don’t have to do any other work.
Why Would Prospects Be Willing to Give You Their Email?
A lead magnet has to have real value attached to it, as you’ll soon see. Because of this, the people who encounter them understand and accept the trade off.
Look, it takes some effort to unsubscribe from email lists you don’t want to be on. Most people won’t put themselves through this if they don’t believe the communication is worth it — which is good! It means you’ve already done some of the work in convincing them of your value as a design expert.
Now you need to use their contact information and convince them to pay for your services.
How Can Web Designers Use Lead Magnets?
Here are some real examples from designers, agencies, and others in this space that make good use of lead magnets:
Informational Content
As a web designer, you might not be too keen on having to write anything. That said, ebooks are an effective way to generate leads on a website.
Web marketing solutions company Bizzuka has examples of these all over their website.
As you can see, it’s appended to the end of a related blog post. It then drives visitors to a landing page with more information and a simple form.
But if you’re really not comfortable or confident in writing an ebook, and don’t want to pay someone to do it for you, think about filming a video or developing an infographic. Just make sure it’s full of valuable information they’ll be dying to get their hands on.
Educational Content
For those of you that enjoy educating others, this could be a good one for you. You’ll just need to find a way to make this relevant to what you do and how you serve clients.
Web Design Journey has a neat example.
As their target audience is web designers and developers, they’ve produced an email course that reveals valuable insights gleaned over nearly two decades of working in the industry.
Again, if you want to avoid any writing, you could always create your own video course and then gate it off with a landing page and form. Or you could publish a webinar (live or pre-recorded) that offers highly targeted educational content.
Design Templates
It’s up to you to decide what type of design templates would be the most valuable to your prospective client base. Realistically, these templates will be things like:
- Icon sets
- Email designs
- Infographic wireframes
- Presentation shells
- Social media kits
Basically, focus on the smaller marketing bits that require a designer’s touch and that they won’t be able to handle on their own. Once they realize how helpful those were, they’ll come to you for web design assistance.
If you’re looking for inspiration on how to promote this type of lead magnet, take WebDesignerDepot’s lead:
Visitors get to see the awesome lead magnet for themselves, but can only gain access to editable files through a form.
Audits
When you first started designing websites for clients, you probably offered consultation and auditing services for free. But you recognize that time equals money, so why give away valuable advice for free and run the risk of them taking your tips to the competition?
A safe way to do this is to turn your audits into lead magnets. This way, you at least get their email address, so you can follow up post-delivery and work on convincing them to work with you through that direct channel.
Lounge Lizard has found a neat way to do this.
When visitors take a peek under their list of Services, they find “Free Website Audit” at the bottom of the list. They’re then taken to the simplest of landing pages:
Lounge Lizard proves that they’re not out to waste anyone’s time. There’s no big sales pitch and no need to ask for excessive information. Just “what’s your domain and how can we contact you”, and that’s it!
Wrapping Up
Before you do anything else, make sure you have an impressive-looking website that attracts visitors. And also get yourself on social media channels like Twitter. Lead magnets don’t usually take too long to make, but you don’t want to waste time building one if you don’t have a reliable place to house it or strategies in place to promote it.
Featured image via DepositPhotos.
Add Realistic Chalk and Sketch Lettering Effects with Sketch’it – only $5!
Source -
20 Best New Portfolios, January 2019
Posted:Mon, 14 Jan 2019 10:45:58 +0000
Welcome back, WDD Readers. It’s January 2019, and we’re all coming back to work bleary-eyed and bushy-tailed. Why don’t you take a moment to put off wor… I mean get inspired by these new portfolios? We’ve got a fair bit of variety in aesthetics and strategies this month. Enjoy.Note: I’m judging these sites by how good they look to me. If they’re creative and original, or classic but really well-done, it’s all good to me. Sometimes, UX and accessibility suffer. For example, many of these sites depend on JavaScript to display their content at all; this is a Bad Idea
, kids. If you find an idea you like and want to adapt to your own site, remember to implement it responsibly.Robbygraphics
Robbygraphics starts us off with some modernist minimalism and a touch of illustration. It’s a part of that business-friendly wave of design that I mentioned recently, and it’s a fine example of the trend.
My only critique is that the hero image on the home page could really be SVG. PNG is great and all, but large vector illustrations are better served in a vector format, these days.
Platform: WordPress
O
Yup, this designer is named “O”. The one-page portfolio is a bare-bones as the name, with simple typography, screenshots, and red blobs that change shape as you scroll.
I’m not a huge fan of animations that absolutely depend on having smooth scrolling turned on (I keep it turned off), but overall, it’s a good-looking site.
Platform: Custom CMS built on Ruby (I think)
Florent Biffi
Florent Biffi stands out in the crowd with bold text on a sort of… wrinkled cloth texture? Look, the effect, while simple, is fairly striking. I haven’t seen it a lot. The rest of the site is fairly standard sans-serif fare with thick headings and occasionally-overlapping elements. That first striking visual is enough to keep a user scrolling all on its own, and that’s the point, isn’t it?
Platform: Static Site
Timo Kuilder
Timo Kuilder makes new-age-ish cip-art-ish illustrations that look… way better than that sounds. So of course the whole site leans into the aesthetic, using a light masonry collage of the work to sell their services.
Platform: Cargo Combined with Backdrop, apparently.
D7 Creative
D7 Creative takes an interesting and highly interactive approach by making every section of their one-pager look almost completely different. I mean, that’s one way to showcase your range, right? Plus, they have a fully functioning game of Snake that you can play.
It’s not the most visually consistent approach, but rules are made to be broken eventually.
Platform: WordPress
Playground
Playground is a fusion of the corporate-friendly aesthetic (including lots of solid blue and red) with the constantly-overlapping elements of more post-modernist web design. There’s also plenty of animation, but it’s understated enough that it’s not too distracting. I like this style a lot, but don’t make me come up with a name for it, please.
Platform: Static Site
Camilo Alvarez
Camilo Alvarez hit me right in the nostalgia. I had a phase where I used a sort of “film grain” effect for almost everything. Well the film grain is back with an animated vengeance, overlaid on a sort of post-minimalist design. As with most of these sites, it’s a bit JS-heavy for me, but it’s pretty and it’s making me feel young again, so it’s here on the list.
Platform: WordPress
Fly Digital
Fly Digital is going very minimalist, and reminds me of the ’90s in a good way. I normally wouldn’t recommend a handwriting typeface for body text, but when there’s this little text, you can get away with it. Though the text could be bigger. And I wouldn’t blur out those client logos on the home page, even if you are going to unblur them on hover.
Otherwise, the site feels handmade and old-fashioned without feeling amateurish. It’s a fine line to walk, but they’re doing it.
Platform: WordPress
epo
Where other sites merely feel modern, epo feels super modern. It’s like flat design had a baby with a corporate color palette. It’s like easy listening music in web design form. None of that is criticism, mind you. If it gets them the clients they want, then it’s doing the job right.
Platform: WordPress
Breadhead
Breadhead brings us some of that classic elegant dark-layout minimalism that we don’t see nearly often enough these days. Thin type, illustrations, and an all around classy feel are what will make this design stick in your brain for a while.
Platform: Static Site
Marijn Bankers
Marijn Bankers’ portfolio reminds me, at first, of an animated spa brochure. You know, the whites and pastels, then thin type, the thinly-lined UI elements, everything. As you dive into the site, it feels more like an architecture firm.
And then it all makes sense when you look through the portfolio. His clients are exactly those who would appreciate the aesthetic. I keep highlighting websites with this approach for the simple reason that it works. Portfolios tailored to the clients just work.
Platform: Static Site
Anvar Shoe
Anvar Shoe’s portfolio eschews the aesthetic fusion we’ve been seeing lately for a site that looks positively post-minimalist. It’s artsy all the way with a mostly-one-column layout and effects that, once again, kind of depend on smooth scrolling to look good.
Platform: Static Site
YRS Truly
YRS Truly is an interesting case. I’ve previously featured portfolio sites that mimic an operating system, but this one fuses the “windows” gimmick with the general structure and layout of a normal two-column website. It’s odd, but it works, and it uses UI conventions that most of us are used to.
Platform: WordPress
Cleverbirds
Cleverbirds’ art portfolio is highly presentational and animated. No points for accessibility here, but if you want some creative and pretty ideas for monochromatic web graphics, look no further. It’s on the list because it’s pretty, and that’s that.
Platform: Static Site
João Pereira
João Pereira’s portfolio is just plain pretty; I love the use of color. While the text could use a little more contrast in places, it’s just generally gorgeous. Plus you can click the triangles in the background to see a list of his skills.
Sure, that’s not intuitive, but it’s better than any “skill progress bars” I’ve ever seen.
Platform: Static Site
Kristopher Bolleter
Kristopher Bolleter’s portfolio leads with text that says, “No cliché slogans, just work that speaks for itself.” Well, he might not know how often I use the phrase “speaks for itself”, right?
All kidding aside, he lives by that motto, presenting all his featured work on one page in old-fashioned iMac illustrations. Man it’s been a while since I’ve seen that instead of the mockup mobile devices. The whole thing isn’t very flashy, but it’s effective and serviceable.
Platform: Hugo
Adrien Laurent
Adrien Laurent brings us back to the flashy stuff with their portfolio. It’s post-modernist, presentational, pastel, and loaded with animation (I couldn’t think of an animation-related word that started with “p”).
Platform: Static Site
Translation
Translation takes a generally bold approach, starting with their overall aesthetic, and on to their assertion that “The world doesn’t need another ad agency.” With a monochromatic palette and really big headings, the whole idea seems to be to blast your brain and hope it sticks. Well it’s working for me.
Platform: Static Site
Anthony Florio
Anthony Florio’s portfolio is fairly standard modernist, with light artsy touches in the form of randomly placed illustration. And it wouldn’t be a photographer’s portfolio without some sort of collage.
Do you ever miss the classic grid full of thumbnails? Nah. Me neither.
Platform: Static Site
Corn Studio
No portfolio list of mine is truly complete without someone using yellow right. In this case, it’s the ever-so-appropriately named Corn Studio gracing us with the classic yellow and black, combined with some highly animated minimalism. It’s flat, it’s pretty, and it’s pretty good.
Platform: WordPress
Add Realistic Chalk and Sketch Lettering Effects with Sketch’it – only $5!
Source -
Popular Design News of the Week: January 7, 2019 – January 13, 2019
Posted:Sun, 13 Jan 2019 10:45:20 +0000
Every week users submit a lot of interesting stuff on our sister site Webdesigner News, highlighting great content from around the web that can be of interest to web designers. The best way to keep track of all the great stories and news being posted is simply to check out the Webdesigner News site, however, in case you missed some here’s a quick and useful compilation of the most popular designer news that we curated from the past week.
Note that this is only a very small selection of the links that were posted, so don’t miss out and subscribe to our newsletter and follow the site daily for all the news.
Design Accessible Maps
Why are all Apple Products Photographed at 9:41am?
For the Freelancers: Here are the Most Valuable Freelancing Resources
Designing for Less
Over Instagram
Dimensions.Guide
Designers are Too Busy to Design
How to Create a WordPress Site: The Ultimate Beginner’s Guide 2019
Why Medium is no Longer the Go-to Platform for Programming Blogs
The Best and Worst Identities of 2018, Part 7: The Click-bait-iest Linked
Misrepresenting the Truth to Make Traveling Easier
CleanMock – Stunning Design Mockups Right from your Browser
Design Audits – What are They and Why You Need One
Are Users Really Stupid?
Aesthetics Vs. Function
Design is not Saving the World
Css Broken Grid Generator
What I’ve Learned After a Year of Non-stop UI Grinding
Is your Design Portfolio Hurting You?
How to Use Interactive Elements in Email
70’s Graphic Design Inspiration
8️⃣ Little Tricks to Grow your Design Career
Exploring the Elegance of Line Typography in Web Design
Designing from Scratch: A Blank Canvas
In Praise of Doing Nothing: How to Turn Boredom into Brilliant Ideas
Want more? No problem! Keep track of top design news from around the web with Webdesigner News.
Add Realistic Chalk and Sketch Lettering Effects with Sketch’it – only $5!
Source -
GitHub Now Offering Unlimited Private Repos to Free Users
Posted:Fri, 11 Jan 2019 14:45:06 +0000
GitHub has made its first really big change since Microsoft acquired it a while back, and it’s a good one for small-to-medium sized design studios, freelancers, and anyone who writes front-end code for fun and profit: Free users now get unlimited private repositories. For free. No money.GitHub has always offered free public repositories, but you had to pay for the private ones; a move which encouraged the flourishing of open source software. But I have personally avoided using it on more than one occasion for two reasons:
- Who really wants people to see their code before it’s ready? That can be kind of embarrassing, especially if your the kind of person who works messy, and cleans everything up after.
- Sometimes you’ll be working under an NDA, or even just a handshake agreement to keep things quiet until they’re ready. Public repos kind of defeat that purpose.
Now instead of heading on over to a competitor like BitBucket, GitHub is an option for people who don’t want everyone to see all those missing semicolons and incredibly vague code comments. Well, it’s an option so long as no more than three people will be working on it. So… freelancers and studios with small dev teams, basically.
If you’ve been avoiding GitHub for any of these reasons, now is the time to get some GitHub experience. It’s nearly essential to working on many teams these days, so it’s good to get in some practice. Besides, GitHub’s GUI for Windows is really good right now, so long as you understand the basic concepts behind Git and its version control.
So that’s what you get out of it. What does Microsoft get out of doing something so nice for all of us working on our personal projects? Well:
- Microsoft gets good press. (You’re reading some of it right now.)
- Microsoft encourages more people to work and play with GitHub, meaning people will be more inclined to adopt the platform when they’re starting their own enterprise-level projects, or when they’re part of a bigger team.
Really, they didn’t have much to lose. Enterprise clients typically need more than three developers to work on a project at a time, so it hasn’t cut into their business model. A few extra projects on their already massive servers are worth more potential customers in the long run.
When I first wrote about Microsoft’s acquisition of GitHub, I believed Microsoft would see the business opportunities in not completely destroying GitHub and its community. So far, so good. Their treatment of GitHub and Visual Studio Code give me hope. Now if only they’ll stop messing about with Skype and Windows 10 updates, they could really impress us.
Add Realistic Chalk and Sketch Lettering Effects with Sketch’it – only $5!
Source -
The Secret Design: Designing Trash
Posted:Fri, 11 Jan 2019 10:45:01 +0000
Oftentimes, no matter how you handle a project, the client is an *** and you’ve no choice but to walk away. JW Waste Management [not its real name] is that kind of client.If we’d paid attention to our collective gut, spotted the obvious warning signs, then we wouldn’t have been caught out. Hopefully some of the lessons we learned will help you avoid the same problems.
The Kickoff Meeting
JW Waste Management is a trash disposal business, they clean out derelict properties, remove trash from waste ground, collect and dispose of small-scale commercial waste. They had (and still have) a site that in our opinion left them worse off than no site at all.
We met with the partners, William and Jim [not their real names] on a muddy lot they sublease from Jim’s father. We arrived 5 minutes early, and spent two hours waiting for them to turn up.
…he doesn’t believe in websites…
When they finally pulled up in a shiny new garbage truck, William climbed out of the cab to greet us but Jim walked away without a second glance. “Don’t mind him,” said William, “he doesn’t believe in websites.”
That should have been our first warning.
William claimed that he and Jim were equal partners, which we later found to not be the case. Best friends in their mid-thirties, they’d met at the local boxing gym and agreed to go into business together. As we later discovered, Jim was already in the family business, William was joining him.
The Brief
The brief from William was simple: Fix the serious bugs in their current site as a short-term patch, and then build them a site that would attract new business.
The brief from Jim was a little blunter, half way through the kickoff meeting he reappeared. “Look bro,” he said, “I don’t give a **** what you do, you just better get me some good contracts or God help you.”
That should have been our second warning, but we laughed it off. Jim had invested in an $800k truck for hauling larger loads and he was obviously just scared he couldn’t pay for it.
The Research Phase
We spent the day doing the rounds with William, learning how their business operated. We rode round in the truck as William picked up trash from various construction projects.
…if we stuck to the letter of the law we wouldn’t make enough money…
Some bins were dropped off at a recycling center, others were dumped out on a concealed patch of scrubland next to their lot. My partner asked if it was legal. “No,” was the short reply, “we’re not zoned for it, but if we stuck to the letter of the law we wouldn’t make enough money.”
We should have walked away there and then. I don’t know why we didn’t. It should have been strike three.
Once we understood how their business operated, we looked into the competition, and this is where the trouble really began.
12 miles away was a rival business called Hudson’s [not its real name]. Hudson’s was an established business that controlled most of the waste disposal in the area. William and Jim modelled themselves on Hudson’s, and wanted to copy the business model. It later turned out they wanted to copy the website too.
Version 1.0
At first, it was a good project to work on. Having patched up their existing site, we began work on a fresh approach.
Waste disposal is not a particularly interesting topic, but we came up with a design that addressed not the waste removal, but the results—clean properties, clean land, buildings ready to be reoccupied. It was a good campaign.
We pitched the idea, then heard nothing back. For weeks. Follow up emails and calls were ignored. Finally Jim accidentally copied us into an email to William: “I’m not paying these *******, who told them they were hired anyway, this is ********, it’s not what I want, no way.”
We were stunned.
We phoned William, when he didn’t answer we rang again, and again. On the third time he picked up. William couldn’t have grovelled harder: Jim didn’t mean to speak that way, he’s not used to business people, they absolutely did want to work with us, they had both signed the contract, Jim was just letting off steam.
We would later realise that William was very afraid of Jim. Their relationship verged on abusive. But at the time, we allowed William to reassure us.
William did have one suggestion: When we’d talked through the brief, they had really liked Hudson’s’ website, could we make our design a little more like that. “Sure,” we said, “we’ll see what we can do.”
Version 2.0
We’re a young agency, and I figure when you’re starting out, you feel like it’s your responsibility to be professional and to make things work. That’s what we tried to do.
As we designed version 2.0 we kept in regular contact with William, a phone call every other day. On every call William told us how much he liked our original idea, but that Jim would never go for it. We tried to reassure him that everything was fine, we’d moved on, we just wanted to do a good job for them.
This time, instead of pitching a complete design, we pitched in stages, trying to get each element signed-off before moving on. Each time, the feedback was the same: “It’s awesome, but it’s missing something. How do Hudson’s do it?”
They’ll look completely different once you’ve applied your ‘design magic’.
As the design came closer to completion we insisted on a face to face to discuss the design. We presented the work alongside a screenshot of Hudson’s’ site; the two sites looked identical.
We tried to explain that it was unethical, and poor business practice to plagiarize another site. “No problem,” said William, “They’ll look completely different once you’ve applied your ‘design magic’.”
We left wondering what they thought our ‘design magic’ was.
The Final Straw
Plagiarized or not, we were well over schedule, and set to make a loss on the job, so sign-off secured we passed the mockups over to our developer.
As the job was coming to completion, we asked William for the text and images. Instead, we received a message from Jim. They had been discussing the design and had decided that the design should be altered to only use their brand blue, with no accent colors at all. After we complained that it simply wouldn’t work, Jim agreed to allow us to add some chrome. When we explained that chrome wouldn’t work on screen he hung up.
With a completed build, but no content, we asked William and Jim to supply the content we needed.
After several false starts, William asked if he could send us some images that we could fix up, and add their logo where necessary. We said we would try. An hour later a link to an image archive arrived.
…we couldn’t believe what we were seeing…
Uncompressing the folder we couldn’t believe what we were seeing. The images had all been stolen from Hudson’s’ site.
My partner was ready to walk, but I wanted to try and salvage something so I called William. “You can just change the color to our blue, and add our logo,” he said, “no one will know.” Despite my protests, he couldn’t see the problem.
That was where we drew the line. I said what we should have said months earlier: No.
The End
We believed that by being professional, polite, and working hard, we could turn the project around. But we should have listened to our guts. We thought we could drag them up, but they dragged us down. We crossed several lines we didn’t want to cross, in the name of being professional.
As soon as we realized that William and Jim wanted a carbon copy of their nearest rival’s site, we should have walked away.
The moral of the story is, don’t work for people who don’t respect you, and definitely don’t work for people who don’t respect themselves.
Featured image via Unsplash.
Add Realistic Chalk and Sketch Lettering Effects with Sketch’it – only $5!
Source -
The Right & Wrong Way to Use Templates
Posted:Thu, 10 Jan 2019 10:45:48 +0000
I’m a big fan of templates. They’re an essential part of any productive designer’s workflow and they can also be really helpful in boosting your brand’s identity through greater consistency and professionalism.Project management templates are one such example of templates that definitely belong in the workflow of a web designer. They free you from having to handle tedious project and time management tasks and, consequently, enable you to focus more on your work.
I also really like design snippets, mockups, and themes (like the ones you might find in WDD’s Freebies). When you use the same kinds of design elements over and over, it makes sense to have a reliable base of templates to pull from.
What I’m not particularly fond of—and you shouldn’t be either—are design templates that remove all creativity and strategy from your process.
The reason I bring this up is because I believe there is a right way to use templates in web design, and a wrong way.
The Wrong Way to Use Templates in Web Design
I recently attended a WordCamp event to learn more about what’s happening in WordPress and, specifically, what sort of trends I should be on the lookout for in web design.
There was one session I attended called, “Fast Track Your Design Process”. I was excited for it as I’m all about productivity hacks that help you work less while accomplishing more.
However, I walked away from the session incredibly disappointed by what I heard; the speaker told the room of about 50 designers that they should be building client websites using templates. That suggestion I had no issue with. I believe that WordPress themes are a great time-saver for many web designers—especially if they’re looking to start with a strong, responsive base that they can customize.
The problem, however, was in the rest of the advice given. It basically went like this:
1. Find a theme that fits your target niche nicely
For instance, if you design websites for real estate companies, purchase a license for a real estate theme.
Make sure you’re very familiar with the theme you choose.
2. Identify the key pages that your typical client needs on their website
Home, About, and Contact pages are a given.
Similar to how a theme developer might provide a few page layouts or design options to choose from, you would do the same. You could use the templates from your theme or design your own. Then, create no more than two or three template options for each page.
3. Save all your templates for future use
These are for no one to see but you.
4. Sign a new client to your web design services
Explain to the client that you are going to build the perfect website for their business. Have them sign the contract and provide you with any branding information or images you need to use.
Then, use this limited set of templates to build every website you’re hired to create. You still have to choose which of the page template options make sense for each client and add personalized content to the pages. But that’s about it.
The goal here is to make as much money as possible from each job.
5. Don’t engage with the client about the web design
Someone asked the speaker how he explained to clients that he was using templates to build their websites. (Which is a valid concern.)
To this, he told them that the client didn’t need to be involved in the process. Web designers are the experts and they know best, so clients shouldn’t have any say in what goes into the website and don’t need to see it until the work is complete.
My Two Cents on the Matter
At that point in the lecture, I raised my hand and presented a number of objections:
- It’s a terrible practice to not involve the client in their website project. It can lead to costly rework and also has the potential to hurt your business through negative reviews; people love to talk about bad experiences.
- When you limit web design to a few templated options, you run the risk of creating lookalike websites—especially if you take a niche approach to your business. This could hurt your business if clients start to notice that you’re not putting any time or effort into the work. Also, how can you expect to build an impressive portfolio if every website looks the same?
- This could also hurt your clients’ businesses if their visitors realize there’s nothing unique to the site since it’s just a copycat of another.
My input was not well-received, but I’m hoping you can appreciate the logic here.
The Right Way to Use Templates in Web Design
I’m not opposed to using templates in web design. Heck, I think that if you don’t use templates in your business, you’re making a huge mistake.
I understand the desire to want to cut corners so you can make a higher markup on your website projects. We all want to make more money. But I don’t believe that removing all strategy and creativity, and providing clients with a canned website is the solution. There are other ways to make use of templates and boost profits in the process.
Themes
Themes that skin your entire website are a great option. You still have to customize them and work on crafting search-optimized content (written and visual) for the website. But they’ll save you a lot of time.
Sectionals
Sectional templates are a good way to quickly replicate the same design elements across a website.
Another way to use them to your advantage is by turning them into wireframes. Use the bare bones of a sectional template to quickly bootstrap the structure of a page on another website.
WordPress Template
There is a multi-site management tool called ManageWP that comes with a WordPress Template Builder.
If you build websites with WordPress, you can use this to save time with new installations. Simply create your template WordPress install and add the plugins (and themes) you use often on your client websites.
Project Management Checklists and Templates
Perhaps the best way to save yourself time is to simplify as much of your project management work as possible. (That’s the part of running a freelance design business that you dislike the most anyway, right?)
Create checklists for all of your web design and business processes. Develop templates for communications you send to clients, contracts for new projects, and instructions you provide to freelancers or other team members. Even templatize your invoicing.
Summary
There is a difference between adopting templates for the purposes of optimizing your design workflow and adopting them so you can avoid doing any real work. I think this is what leads to the delivery of poor websites and gives clients a way to talk designers down in price.
You are a web designer and you’re being paid to provide a creative service. While 100% of the elements you put on a website don’t need to be handcrafted by you, you can’t expect clients to pay you well if no thought or consideration was put into the development of their design.
Featured image by Fancycrave on Unsplash.Add Realistic Chalk and Sketch Lettering Effects with Sketch’it – only $5!
Source -
Respectful UX: 5 Ways to Make Users Feel Valued
Posted:Tue, 08 Jan 2019 10:45:57 +0000
Every human being needs, rather desperately, to feel accepted. They don’t necessarily need to feel accepted by everyone, but they do need to feel accepted by someone. It’s a part of our nature, and nature in general. Even as I type this, my cat Cleocatra is demanding that I give her attention, and if I don’t, she’ll leave my room in a huff.[A few minutes later:] She didn’t leave. She stuck her claws into me. Users can have very similar reactions if their needs aren’t met when interacting with your website. Humans will anthropomorphize anything, and if they feel like your website doesn’t accept them for who they are, they might just go find one that will. Or do the claw thing.
This is why users need to feel accepted and respected when they use your site. I’ve put together some ideas about how to achieve that. Don’t expect a list of fifty genders to put in your forms, I’m not the guy to ask about that; this is just usability 101:
1. Respect Their Time
Build your website or product to be as efficient as possible. When users leave because your website didn’t load in five seconds or less, it’s not because they’re entitled. It’s because they have stuff to do, and a finite amount of hours in the day to do it.
If your site asks them to jump through a bunch of hoops before they can even read your content, or get that free e-book, or what-have-you, you’re not respecting their time. If your sign-up form is too detailed and asks for too much information, you’re wasting their time.
Think of all the meetings you’ve had that could have been emails. If your site feels more like going to a meeting, they won’t want to go.
2. Avoid Assumptions & Judgment in all Content
People often hate it when you make assumptions about them. They hate it when those assumptions are wrong, and they especially hate it when the assumptions are right. What will tick anyone right off is when those assumptions come with judgment.
Goddammit Netflix. Yes, I’m still watching.
Marketing in general has operated on assumptions and judgment for years, promoting now-derided ideas about what it means to be male, female, a good parent, or a good person. If you haven’t noticed, these assumptions have been the subject of considerable debate for years, now, and many are even considered harmful.
When you make too many assumptions about who is, or should, be using your website, you risk running off users and customers. Now, why would you do that?
3. Encourage Trying Again
People make mistakes, and lots of them. It’s normal, it’s life, and it’s why we have form validation. Now, if your users are signing up for or buying something they feel they absolutely need, and can’t get anywhere else, they’ll stay. They’ll keep trying to fill out your form, or follow your app’s arcane process for doing things, or no matter what.
I know I’ve personally abandoned checkout processes because, in the end, I felt like the thing I kinda sorta wanted to buy wasn’t worth the effort to try to buy it twice. I figured that if they wanted my money so badly they wouldn’t have made it so hard for me to spend, and went on my merry way.
Having to re-fill entire forms is a particular pet peeve of mine. If there’s a mistake, let me go back and fix the one mistake I made. Do not make me refill entire sections of the form. That just makes me wish I hadn’t bothered in the first place. Encourage people to try again when a process fails by not making them redo more work.
You can also encourage them to try again by never making them feel dumb for screwing up in the first place. Error messages should be clear, gentle, and encouraging. Making users feel dumb is the fastest way to put them on the defensive, and defensive people don’t buy stuff. Make it clear that mistakes are just part of the process sometimes, and they are more likely to feel accepted.
4. Provide Clear Instructions
People are more likely to feel like they belong when they know what they’re “supposed” to do. Learning the rules of any peer group is the first step to feeling accepted in a new place.
Clear instructions can provide this confidence to users (and help avoid situations where they feel dumb). You can do this in your copy, in your micro-copy, or even with those animated walk-throughs that so many apps have nowadays. I’d even go further, and say to have illustrated instructions whenever you can.
Think of those credit card input forms that look like actual credit cards. They’re a perfect example of setting clear expectations and easily-understood requirements. Users that have a clear idea of how to do what they want to do on your site will feel like they belong there.
5. Make a Human Point of Contact Available
“Nah, you’re doing fine.”
“Don’t worry about it. We have it covered on this end.”
“No, that was our mistake, really.”
“No worries, you got everything right.”
“Okay, that is a problem, but we can fix it.”
We all need reassurance from time to time. It helps to have another human being tell us that everything’s going to be okay in the end, and that we didn’t irrevocably ruin things for everyone. Want people to feel accepted? Give them a point of contact with people who can tell them those things.
Even if it’s just an email address, people need a way to talk to another person. Ultimately, a website can only do so much to make people feel accepted and respected. Sometimes, you just need the human touch to make a human connection.
Above all, delivering a feeling of acceptance and respect to people is about recognizing and even appreciating their humanity. We don’t always get enough of that in a digital world.
Featured image via Depositphotos.
Add Realistic Chalk and Sketch Lettering Effects with Sketch’it – only $5!
Source -
3 Essential Design Trends, January 2019
Posted:Mon, 07 Jan 2019 10:45:24 +0000
New year, new design trends!While everyone is talking about big-picture trends such as designing for voice and virtual reality, there are more immediate design elements that you can see (and deploy) right now for a more on-trend website.
From websites without images above the scroll, to ecommerce that disguises itself as content, to bright blue everything, here’s a look at what’s trending this month.
1. No “Art” Above the Scroll
Have you noticed how many websites don’t have images or video above the scroll? This no “art” design style used to be reserved for coming soon or construction pages that didn’t have images, but it’s trending even for website designs with plenty of other imagery.
If you have a message or statement that is the most important thing for users to know right away, this can be an effective design technique. It works because there’s nothing else to see. (Unless the user refuses to read the words and abandons the design, which can be a risk with this style.)
Make the most of a no art design with beautiful typography and strong color choices.
These design elements can serve as art on their own and help add visual interest to the words on the screen.
Each of the three examples below does this in a slightly different way.
We Are Crowd uses a strong serif-sans serif typography pair on a bright colored background. Users are enticed to delve into the design thanks to an animated scroller on the homepage. The no “art” design actually alternates between image and non-image panels, showing users there is something to look at.
Easys uses a simple serif in the center of the screen to draw the eye. Bright red text on a stark background draws you right to the lettering. There’s also a call to scroll, where the design fills with more color, images and interesting shapes.
David Pacheco’s portfolio takes a more minimal approach to the no art aesthetic. With simple, but oversized sans serif typography and a black background, there’s no way not to know what the website is about. The stark nature of the design makes the small, animated scroller at the bottom left more obvious, and it’s worth the effort with great images of his projects.
2. Bright Blue
It might not come as a surprise that a bright color is trending. But the hue might surprise you. Even though a bright coral was named color of the year by Pantone, bright blue is trending.
Bright blue backgrounds, text elements, overlays and more are everywhere. The color, which has roots in the Material Design palette, is rather cheerful and works with almost any content type. These are reasons why it might be so popular.
Blue is traditionally one of the most used colors among all website designs. Mostly because of associations that are harmonious, pleasing and trustworthy. This brighter blue adds to that with a somewhat lighter feel.
The best part of a website design trend that’s rooted in color is that it’s easy to use. Designers don’t have to overhaul a brand color palette to incorporate bright blue into the design. Sneak it in for accents or in images.
This is also a trend that you can add to a project quickly and without a lot of planning for a modern flair that can be deployed (and even removed) with minimal effort.
Like the blues you see in the examples below? Try these color mixes to replicate the hues:
Matt Downey uses a bright blue with an almost purple undertone; hex #263d83.
Output scrolls trough plenty of bright blue options on the homepage with more purple (hex #4d34d8) and brighter sky blue (hex #3a63d8) options.
Florent Biffi puts a new spin on navy with a brighter tone; hex #142877.
3. Ecommerce That Looks Like Content
Content is king…even when it comes to online sales.
Maybe as a design trend that’s a carryover from social media or maybe just to try something that’s a little more engaging, more ecommerce websites are deploying site architectures that look less like pages of items for sale and more like integrated content elements with a “buy it” button included.
This idea makes sales more about lifestyle and uses a product placement philosophy to sell items. This design concept can take a lot of time to plan out and design effectively, but it can be worthwhile if it resonates with a new customer or shopper base.
It’s likely that it takes a certain type of product as well. Ecommerce websites that use a lot of content and that look more like content that product sales or information tend to be lifestyle brands such as clothing or home textiles. This is because these items don’t need a lot of explanation–most shoppers know what size shirt they wear–and create a sense of urgency in the desire to buy. A customer sees the shirt and want it because of the associated sense of style or connection to brand.
It’s an interesting way to create a more authentic connection with users–a key marketing concept, particularly among millennial shoppers and audiences. It’s one of those design trends that has a lot of potential to grow, but only if designers and developers are willing to commit the time and resources to overhaul their ecommerce projects in this manner.
Conclusion
When it comes to using website design trends, the ones that come and go the quickest are the ones that are most deployable. Some of those–such as color–are on this list. Others, like ecommerce that looks like content, takes a lot more strategy to do well. Which type of trend are you most likely to try?
What trends are you loving (or hating) right now? I’d love to see some of the websites that you are fascinated with. Drop me a link on Twitter; I’d love to hear from you.
Add Realistic Chalk and Sketch Lettering Effects with Sketch’it – only $5!
Source -
Popular Design News of the Week: December 31, 2018 – January 6, 2019
Posted:Sun, 06 Jan 2019 10:45:27 +0000
Every week users submit a lot of interesting stuff on our sister site Webdesigner News, highlighting great content from around the web that can be of interest to web designers. The best way to keep track of all the great stories and news being posted is simply to check out the Webdesigner News site, however, in case you missed some here’s a quick and useful compilation of the most popular designer news that we curated from the past week.
Note that this is only a very small selection of the links that were posted, so don’t miss out and subscribe to our newsletter and follow the site daily for all the news.
8 Undoubtably True Predictions for UX in 2019
Design Style Guides to Learn from in 2019
A Collection of Great UI Designs
Site Design: Coding is Fun!
8 Examples of How to Effectively Break Out of the Grid
The 15 Coolest Interfaces of the Year
4 Useless Things You Shouldn’t Have Put in your Design Portfolio
Meet Twill: An Open Source CMS Toolkit for Laravel
The Grumpy Designer’s Bold Predictions for 2019
This is not User Experience
Branding Design – What You Need to Know Before Creating a Brand Identity
The Year that Was: 2018 in Web Design
Flat Design Vs. Traditional Design: Comparative Experimental Study
Users Don’t Read
Writing Copy for Landing Pages
The Elements of UI Engineering
Motion Design Looks Hard, but it Doesn’t Have to Be
Merge by UXPin
Responsive Design, and the Role of Development in Design
Material Design Colors Listed
Designing a Great User Onboarding Experience
How to Name UI Components
Is Design Valuable?
40+ Best Bootstrap Admin Templates of 2019
UI Design: Look Back at 12 Top Interface Design Trends in 2018
Want more? No problem! Keep track of top design news from around the web with Webdesigner News.
Add Realistic Chalk and Sketch Lettering Effects with Sketch’it – only $5!
Source
FeedBurner delivers the world's subscriptions wherever they need to go. Publish a feed for text or podcasting?
You should try FeedBurner today.