The Idea Generation Process of Scribbling on a Napkin

Millions of us around the world eat at restaurants every day with our family, friends, co-workers, clients, parole officers… just kidding. Restaurants serve an important purpose in our lives – a purpose that has less to do with food and more to do with the way we connect with one another.

The restaurant has been around, in some form or another, since ancient Rome, and its function – to bring people together over a conveniently cooked meal – has changed very little in all that time.

There’s another benefit of restaurants that specifically applies to designers and other creative people, and that is to stimulate your creativity. That’s right – it’s been proven that socializing improves your intelligence. Not just academic intelligence either – interacting with friends and peers actually helps to make you more creative.

When you go out with others, you’re exposing yourself to an influx of new ideas that can’t help but positively influence your creative process. And food is a natural bonding agent, which is why so many creative ideas are born around a lunch or dinner table with other designers, artists, musicians, writers, et cetera.

Today, I’m going to explore the idea generation process familiar to so many designers who eat out with friends: the “awesome idea scribbled on a restaurant napkin” process.

It’s very high-level stuff. No, really! The lowly napkin sketch (or scrap paper or ledger pad sketch) has been used by everyone from babysitters all the way up to top creative executives at Microsoft and Walmart to bring to life important ideas that change the world, or at least bring in more profits.

Some experts say that the business sector is too dependent on language to express ideas that really should be expressed using visuals (i.e., sketches). That’s good news for us designers, but how exactly do we adapt it to our working process to make things easier for ourselves and our clients?

We designers all know the advantages of sketching: it’s a way to sort out our preliminary ideas and eliminate the ones that aren’t right for the job.

Of course, you don’t have to sketch on a napkin, but any kind of sketch is more useful than just thinking about the idea, because it requires you to use a different part of your brain.

web design flow sketch
Image Source

When you think, or read, or write, you’re nurturing the connections your brain makes between the different thoughts you have (called ‘neural pathways‘), and increasing your brain’s “elasticity.” When you add drawing to that process, you’re exercising important motor skills that can actually feed your creativity.

Personally, I prefer to sketch on paper. Why? Because it allows me the opportunity to step away from the computer for a brief moment and collect my thoughts on something I can touch and hold in my hands.

That’s important to me, and to a lot of designers whose work almost always ends up on the computer one way or another.

We humans respond to things that are interactive, and that allows us to make a direct impact on something. Ever wonder why more and more vending machines are see-through, rather than opaque?

The working mechanisms of those machines are engaging to our brains – we love to put our money in the machine, and literally see our desire (to have a refreshing beverage or snack) being fulfilled right before our eyes. It’s fun.

And guess what? Your clients are the exact same way.

Logo Design on Napkin
Image Source

If you’re a designer or art director redesigning a company’s brand identity, how do you make sure everyone there understands the creative vision you have?

Well, you could tell them. But most people aren’t going to take notes and will end up misinterpreting what you said at some point or another.

You could show them a presentation, which might work for some people. But I think that printing out handouts of your sketches, and walking people through them is the best way to involve them in the decision-making process.

Sometimes, sketching can be used to effectively communicate ideas to people – designers or non-designers – in ways that far surpass, say, a PowerPoint presentation.

Think about what you’d rather have in a department meeting: a dry, preachy collection of slides, or a sketchbook to work out your ideas about the company’s creative direction?

Just like a clear-windowed vending machine allows us to see the effect our money has on it, involving people with live sketching gives them a democratic insight into how design decisions are made.

It can turn a lofty, complicated mess into something that’s easy for everyone to understand. And we all know that an informed client is a happy (and oftentimes repeat) client.

You don’t want to just talk at your clients and lecture them about things that are going to go over their heads. Your clients aren’t stupid (well, hopefully not).

They are running a company, after all. Clients like to feel creative, or at least like they’re contributing to something to the creativity of their businesses. And what better way to make grown adults feel powerful and in charge of something than by handing them some paper and making them draw like grade-schoolers?

All joking aside, people love that stuff. It creates a feeling of harmony and democracy in the company, as anyone, from the janitor to the CEO, can make a sketch.

As Lou Levit explains in his article, How Sketching Will Take Your Design Process to the Next Level, sketching allows you to “dig deeper” with your idea process, uncovering more design solutions that often work much better than the initial ideas you start out with.

Silicon Valley Napkin ideas
Image Source

Another downside to simply absorbing information via presentation is that it tends to lead your client through the design process with minimal challenge to their own imagination.

Because of this, your client may not really understand your reasoning behind a more nuanced design solution, and may fight you on it. Presenting sketches is one way to quiet those feelings of misunderstanding. The more your client can see of your process, the more likely they are to trust your judgement.

The key to engaging your clients with sketching is to think of your design meeting more like a restaurant date with friends. Obviously, you should probably keep the celebrity gossip and alcohol consumption to a minimum, but the general feeling of creative camaraderie should be the same.

Engage your clients with spontaneous sketches, draw things out for them that you might otherwise just dryly explain, and observe the difference yourself in their level of understanding, engagement, and trust.

You don’t have to make them draw too, though, as I mentioned before, many people do love that. But just like passing around a napkin at the restaurant table to your friends can result in weird and wonderful new ideas, incorporating sketches in your meetings with clients can propel your projects to heights that you never would have expected.

The post The Idea Generation Process of Scribbling on a Napkin appeared first on Speckyboy Design Magazine.

Did you miss our previous article…
https://www.1clanek.info/?p=1367

10 Totally Free WordPress Backup Plugins

Backing up your precious data is a common best practice these days. But, what about your WordPress-powered website? Yes, most web hosting companies do perform regular system backups.

But beware – not every host is reliable when it comes to backups. And you certainly don’t want to wait until disaster strikes to find out how they did.

You’ll get much more peace of mind if you perform regular site backups yourself. Luckily, there are several outstanding free plugins that will do the job for you.

Note that there are some differences in what various plugins will backup. A WordPress website is comprised of both a database (usually MySQL) and a set of files that sit on the webserver.

You’ll really only need to worry about the /wp-content/ folder, which contains your theme, plugins, and file uploads. Some plugins backup both the database and files.

Others will handle one of the two. Keep in mind that you’ll need both the database and the /wp-content/ folder to have access to all of your site’s data.

Now, let’s check out some plugins to keep your site backed up. We’ll take note of whether they back up a site’s database, file system, or both.

Total Upkeep – WordPress Backup Plugin Plus Restore & Migrate

WordPress software updates can sometimes cause problems. That’s why it’s important to have backups that can be restored immediately.

Total Upkeep’s auto rollback feature will create backups before you run updates, allowing you to easily restore the site to its previous state. A Pro version also enables cloud-based backups and staging sites.

Backs Up: Database and File System (with an option to customize what gets backed up)

WP Staging – Backup Duplicator & Migration

Having a staging environment for your WordPress website is always a good idea. But if your web host doesn’t offer this functionality, WP STAGING can help.

The plugin makes it easy to clone your site and into a subfolder (or a subdomain, if you opt for the Pro version).

Backs Up: Database and File System

WP STAGING – Backup Duplicator & Migration

WordPress Backup & Migrate Plugin

Backup, restore or even migrate your site. Also available is the ability to download a copy of a backup to keep on your local machine. A pro version lets you schedule backups and connect to various cloud storage services.

Backs Up: Database and File System (with an option to customize what gets backed up)

BackupGuard free WordPress backup plugin

WP-DBManager

Schedule regular backups of your WordPress database and have it both emailed to you and stored on your web server. Restore a backup with just a couple of clicks.

Also, you can schedule automatic database optimization and repair.

Backs Up: Database Only

WP Time Capsule

Rather than doing a time and resource consuming full backup each time, WP Time Capsule will perform an incremental backup of just the files that have changed.

You have the ability to schedule backups and connect to Dropbox, Amazon S3 and Google Drive.

Backs Up: Database and File System

WP Time Capsule free WordPress backup plugin

WPBackItUp

WPBackItUp touts its ease of use – just one click to backup your entire site. The plugin compresses the backup into a .zip file stored on your web server. Backup status notifications will arrive via email.

Backs Up: Database and File System

UpdraftPlus

Automatically or manually backup your entire site to your web server, multiple cloud services, email or even an FTP server. Restore backups directly from inside WordPress. Site migration packages can also be downloaded.

Backs Up: Database and File System (with an option to customize what gets backed up)

UpdraftPlus free WordPress backup plugin

WP Database Backup

Backup your site’s database to the cloud, email, or FTP. Set up a schedule to run on a routine basis. The ability to exclude specific database tables is included.

Backs Up: Database Only

WP Database Backup free WordPress backup plugin

BackWPup

You can schedule complete automatic backups for your site and store them in the cloud. Backups can be compressed into .zip, .tar, tar.gz or tar.bz2 formats. BackWPup will also check, repair, and optimize your database.

Backs Up: Database and File System

BackWPup free WordPress backup plugin

BackUpWordPress

This plugin is all about simplicity – there is no setup required. Backup your entire site on a schedule and optionally have the archives emailed to you. Backups will run even on low-powered web hosting accounts.

Backs Up: Database and File System (with an option to customize what gets backed up)

No More Excuses – Backup Your Site!

A WordPress site can break for many reasons, including a database crash, theme or plugin incompatibility, or a failed web host. But you don’t have to leave things to chance.

There are free WordPress backup plugins that cater to every need. It’s time to be proactive with your website and prepare for the worst. If something does happen, you’ll be glad that you took steps to regularly backup your website.

The post 10 Totally Free WordPress Backup Plugins appeared first on Speckyboy Design Magazine.

Did you miss our previous article…
https://www.1clanek.info/?p=1360

8 Best WordPress Plugins for Providing Customer Support

Whether you’re a web designer serving various clients or a developer who offers products, utilizing your website for customer support makes sense. It provides users with a way to both help themselves and receive help directly from you. Plus, it can serve as a means to organize support requests in a neat and tidy manner.

If your website runs on WordPress, then you have a wide selection of support-related plugins to choose from. They run the gamut from building a simple FAQ or knowledgebase all the way to full-blown ticketing systems. This allows you to build a support area that fits virtually any type of business.

With that in mind, here are 8 WordPress plugins that you can use to provide excellent customer service and support.

Tawk.To Live Chat

This plugin will enable you to place a widget from the free Tawk.To chat application onto your WordPress website (a free account is required). You can customize the widget’s look, which pages it displays on, and embed it anywhere with the included shortcode.

A handy scheduler is also included, which will display the widget only during your operating hours. As a bonus, you can use the service’s mobile app to answer queries from wherever you are.

SupportCandy – Helpdesk & Support Ticket System

With just a few clicks, SupportCandy will add a ticketing system to both the front and back ends of your website. Create an unlimited number of support agent users and assign them tickets, while premium add-ons enable you to automate the process.

Customers can submit tickets via their account or as guests. The plugin also supports custom fields, file attachments, and email notifications.

SupportCandy – Helpdesk & Support Ticket System

Knowledge Base for Documents and FAQs

One of the simplest ways to provide support is through a knowledge base. Knowledge Base for Documents and FAQs is a free plugin that will enable you to build up a support section in very little time.

Create up to three levels of categories and sub-categories, choose from a plethora of pre-defined styles and even implement an AJAX live search. Premium add-ons allow for features like custom layouts and hosting multiple bases on the same site.

Knowledge Base for Documents and FAQs

Quick and Easy FAQs

FAQs are a great option for services or products that don’t need overly in-depth documentation. They’re also handy for providing useful pre-sales information. Quick and Easy FAQs creates a custom post type on your site that lets you add as many questions and answers as you need.

You can display your FAQs in various styles, including a simple list, filterable section-based list, and toggle. The display is handled through a WordPress Shortcode.

Quick and Easy FAQs

Ultimate FAQ

Ultimate FAQ will, like other FAQ plugins on this list, allow you to create an archive of questions and answers easily. You can create categories, display questions in various ways and even export them all to a PDF. But the bonus here is that the plugin can integrate with WooCommerce.

This could be quite a powerful feature for stores looking to offer pre-sales information to users. The premium version of the plugin enables a FAQs product tab to make things even easier.

Ultimate FAQ

WP Live Chat Support

In the right situation, live chat can be a very effective means of helping customers. It provides both a personal touch and an immediate response that helps to build brand loyalty. Using WP Live Chat Support, you can hold multiple one-on-one chats with customers – hosted right there on the same server with your WordPress site.

There are plenty of options, and no third-party subscriptions are required. However, if you want to have features like multiple agents (team members) or data trigger automations, you’ll need the pro version.

WP Live Chat Support

Awesome Support

If you’re looking for a full-fledged support ticketing system, you’ll want to check out Awesome Support. Use it to run a WordPress-based helpdesk that, between the free version and premium add-ons, has just about every feature you’ll need.

By default, you’ll have the ability to create an unlimited number of departments, agent accounts, custom priority levels, and more. Add-ons do things such as syncing product lists with either WooCommerce or Easy Digital Downloads, user reply via email, and Slack notifications – among others. There’s a lot of room to build a system that meets your needs.

Awesome Support

weDocs

weDocs is a free plugin that caters to those who want to build and organize vast amounts of documentation on their WordPress website. The plugin UI sports a handy drag-and-drop feature for organizing items – great for getting articles in just the right order.

There is even a way to bring in documentation from an outside source, which could be a really huge help for those moving in existing content from somewhere else.

weDocs

Support Options

What’s so nice about the plugins above is that they offer you different ways to provide support. You don’t necessarily need a big, complicated system to help customers. In some cases, a simple FAQ will do the trick. But it’s also great to know that more robust options exist if you need them.

The key is in helping people to help themselves first. This will cut down on the number of support requests you receive, and the hope is that if they do reach out to you for further assistance, you’ll be farther ahead by having resources readily available on your website.

Whichever path you choose, look for solutions that will make life easier for everyone involved. The choices above should get you off to a running start.

The post 8 Best WordPress Plugins for Providing Customer Support appeared first on Speckyboy Design Magazine.

20 Free Bootstrap UI Kits

Bootstrap is one of the most popular design frameworks. One of the reasons it’s so popular is that it’s optimized for mobile devices and has a well-organized grid system along with hundreds of elements that make prototyping and designing for the web a lot easier.

There is no doubt that Bootstrap is the best framework to help you design beautiful and responsive web pages. From minimal startup websites to complex admin screens, you can find Bootstrap UI kits and templates for any design. Get inspired by these free Bootstrap UI kits and use them in your next design project.

In this roundup, we’ve collected 20 free UI kits built with Bootstrap (both 4 and 5) that you can use as a starting point for your designs.

Free Bootstrap 5 UI Kits

Pixel Free Bootstrap 5 UI Kit

The free Pixel Bootstrap 5 UI kit comes bundled with over 80 UI elements, 5 example page templates, and more than 50 website sections, so you build any type of website.

Snacked Bootstrap 5 Admin Template

Snacked is Bootstrap 5 admin template and UI kit that comes with over 60 custom HTML page templates, multiple chart options, and a vast collection of UI components.

snacked bootstrap 5 five template ui kit free responsive

Boomerang Free Bootstrap 5 UI Kit

This free Bootstrap 5 UI kit includes over fifty custom components, five integrated plugins, and five pre-built page templates. Boomerang kit is perfect for building a business or corporate website.

boomerang bootstrap 5 five template ui kit free responsive

Qexal Bootstrap 5 Landing Pages

The minimally designed Qexal is perfect for creating landing pages for startups or any other type of business. It comes with nine homepage variations, multiple page templates, and a huge collection of UI components and widgets.

Qexal Landing Pages bootstrap 5 five template ui kit free responsive

Lindy Free Bootstrap 5 Startup UI Kit

The free Lindy Bootstrap 5 UI kit includes everything you need for creating professional startup landing pages. The UI kit comes with over 200 UI elements and 5 example page templates.

Lindy stratup bootstrap 5 five template ui kit free responsive

Free Material Design Bootstrap 5 UI KIT

This free Material Design Bootstrap 5 UI kit is an excellent choice for anyone that wants to build a mobile-first website or an app. The kit comes with 400+ material UI elements, 600+ material icons, over 70 CSS animations, numerous templates, tutorials, and much more.

Material Design bootstrap 5 five template ui kit free responsive

WrapKit Lite – Free Bootstrap 5 UI Kit

WrapKit Lite is a free Bootstrap 5 UI kit that can be used in a variety of projects. It comes with a selection of UI blocks and more than 25 UI elements, and 1 landing page to jumpstart your project.

Wrappixel bootstrap 4 four template ui kit free responsive

Material Kit – Free Bootstrap 5 Material Design UI Kit

Material Kit is a perfect choice for anyone who loves the material design. The Bootstrap 5 UI kit comes with over 60 UI elements and three demo page templates to help you get started on your design.

Material Kit design bootstrap 4 four template ui kit free responsive

Free Bootstrap 4 UI Kits

Argon – Free Dashboard UI for Bootstrap 4

The Argon UI kit for Bootstrap is the perfect choice if you’re working on a dashboard design. The kit comes with over 100 components, 6 different screens, and 4 custom plugins.

Argon admin Dashboard bootstrap 4 four template ui kit free responsive

Grandin Bootstrap Admin UI Kit (Envato Elements)

Powered by Grunt, Bower, and SCSS, Grandin is a professional UI kit that comes packaged with plenty of UI components, widgets, forms, tables, charts, pages and applications.

Grandin admin Dashboard bootstrap template ui kit free responsive

Shards Free Bootstrap 4 UI Kit

The free Shards Bootstrap UI kit comes with 10 extra custom components and 2 custom pre-built landing page templates. You’ll also find more than 1,500 icons both from Material and FontAwesome packs.

Shards admin dashboard ux High-Quality bootstrap 4 four template ui kit free responsive

Dashboard HTML Template for Bootstrap 4 (Envato Elements)

This lightweight Bootstrap 4 UI kit includes five dashboard layouts, over 100 components, and a complete set of UI elements, including charts, forms, calendars, tables, and many more.

admin Dashboard bootstrap template ui kit free responsive

Drunken Parrot Lite Bootstrap 4 UI Kit

This kit includes both HTML and PSD files so you can easily customize and tweak the design to suit your needs. The kit is lightweight and it comes with various components and pages that will help to speed up your design process.

Drunken Parrot Lite bootstrap 4 four template ui kit free responsive

Now Free UI Kit for Bootstrap 4

Now UI Kit is a responsive Bootstrap 4 kit provided for free by Invision and Creative Tim. It features over 50 elements and 3 page templates. The kit provides PSD, Sketch, and HTML versions.

now web bootstrap 4 four template ui kit free responsive

Fuzen Bootstrap 4 Admin UI Kit (Envato Elements)

Fuzen is a Bootstrap 4 UI kit that comes bundled with three dashboard layout templates, over 200 UI components, over 3,000 icons, and multiple widgets. It has been designed with Material Design in mind.

admin Dashboard bootstrap template ui kit free responsive

NowSquare – Free Collection of Bootstrap 4 Web Blocks

Built upon Bower, GulpJS, and Sass, this free collection of web blocks has been designed for Bootstrap 4 and allows you to get ahead on your design project. The kit is easy to use straight out of the box and can be easily customized to the needs of your project.

NowSquare bootstrap 4 four template ui kit free responsive

Froala Design Blocks for Bootstrap 4

This Bootstrap UI kit includes over 170 responsive design blocks that are ready to be used in your web or mobile apps. You’ll find blocks for calls to action, profile blocks, contact, blocks, forms, headers, and more.

Froala Design Blocks bootstrap 4 four template ui kit free responsive

Paper Dashboard – Free Bootstrap 4 Admin UI Kit

The Paper Dashboard is another great choice if you need to prototype and design an admin dashboard for your project. The UI kit comes with 16 components, 4 customized plugins, and 7 demo page templates.

Paper Dashboard admin bootstrap 4 four template ui kit free responsive

Anchor – Free Bootstrap 4 UI Kit

Anchor is a free Bootstrap UI Kit with flexible, ready to use UI components that will help you build websites faster. It features a modern and colorful design.

anchor bootstrap 4 four template ui kit free responsive

Stream Free Bootstrap 4 UI Kit

The Stream UI Kit is a beautiful and elegant Bootstrap 4 UI Kit. The UI kit comes with five beautiful complete page templates and includes over 20 reusable and customizable UI Blocks.

stream bootstrap 4 four template ui kit free responsive

Bootstrap 4 Startup UI Kit

Try the Bootstrap 4 Startup UI kit if you’re working on the website design of a startup. The kit features a clean and minimal style and comes with 16 UI cards that you can mix and match to create your own unique layouts.

Startup bootstrap 4 four template ui kit free responsive

Free Bootstrap 4 eCommerce UI Kit

Check out this kit if you’re designing an e-commerce website or an application. The template comes with several starter templates to get you started as well as numerous icons and elements.

eCommerce shop bootstrap 4 four template ui kit free responsive

The post 20 Free Bootstrap UI Kits appeared first on Speckyboy Design Magazine.

Did you miss our previous article…
https://www.1clanek.info/?p=1329

Fresh Resources for Web Designers and Developers (November 2021)

One thing that I love with Web development industry is that we, as developers keep innovating to make the web better. This is why we’ve always found new exciting tools and resources to feature on our list.

In this round of the series, we have a tool to create nice realistic shadows using CSS3, several new frameworks and libraries for React.js, and PHP.

Without further ado, let’s jump in to see the full list.

Fresh Resources for Web Designers and Developers (October 2021)

Fresh Resources for Web Designers and Developers (October 2021)

We’ve been running this series for several years now and it feels like we never run out of… Read more

Shadow Palette

A little GUI tool that allows you to create a more realistic drop shadow for your website. You can customize several of the shadow properties such as the light position, color, and opacity. The tool will generate the CSS rules that you simply can copy and implement on your website.

Firefox Relay

Relay is a service from Firefox that allows you to create an email alias of your real email address. You can create several email aliases of one email address, and use them when signing up on websites like e-Commerce, membership, and subscription, etc. It’s a great service to protect your online privacy further.

SVGCode

A little online app to convert raster images into SVG easily. The tool supports several image formats including JPG, PNG, and WebP. It’s built with the “Progressive Web App” approach, which means even if you’re offline, the app is still going to work. Simply drag-n-drop any image onto the app and it’s all set.

A Look into: Scalable Vector Graphics (SVG)

A Look into: Scalable Vector Graphics (SVG)

Vector graphics have been widely applied in print media. In a website, we can also add vector graphics… Read more

Framework X

A simple framework to create a reactive application using PHP. Internally, it leverages some PHP extension like Coroutines and Fibers (available since PHP8.1) to handle the concurrent and async operations akin to Node.js. You can use Framework X everywhere that runs PHP including shared hosting.

Shopify Hydrogen

Hydrogen is a new React.js framework from the team at Shopify. It comes with building blocks to create a custom Shopify storefront such as utility functions, custom React.js hooks, and components.

If you’re looking to build a Headless store with Shopify, this framework has got you covered with the necessities.

Frappe Charts

A lightweight JavaScript library to create a chart. You can install it as an NPM module or simply load the JavaScript file on your webpage like in the old days.

It supports several types of charts including bar and pie charts. It’s also responsive and fast since it is not dependant on other external JavaScript libraries.

20+ Useful Online Chart & Graph Generators

20+ Useful Online Chart & Graph Generators

Most people, like me, do not understand mere numbers and statistics and for such people charts and graphs… Read more

Chrome DevTools Recorder

Google Chrome has just made an improvement to the DevTools with a feature called “Recorder”. This feature allows you to record your website interaction.

You can replay the recorded interaction or emulate it with certain environment and conditions. It provides a better measure on the real web application performance. This feature will be shipped as a beta feature on Chrome 97.

Remix

Remix is a new full-stack React.js framework that provides an abstraction to build a better website. It handles routing, error requests, and other tiny details of building a website with great user experience — out of the box. The framework will help web developers become more productive.

Redux Toolkit

An official collection of tools from Redux that aims to make developing a website with Redux more efficient. It includes some utility functions and configs for common use cases.

This way you can be more productive, instead of befuddling with the configurations and the boilerplates, which can be a bit cumbersome.

Bulletproof React

A collection of tips, advice, and best practices for developing React.js application. Here you will learn a lot of topics surrounding app architecture, project structure, styling, state management, and a lot more. If want to improve your React.js skills, you should definitely have it bookmarked.

Apache EChart

An open-source initiative from Apache, EChart is more than just a chart JavaScript library. It’s a robust collection of interactive charts with animations, and with an overall better visual. This allows you to convey the data to the users better than a static chart.

Awesome Design Tools

This resource contains a massive list of tools for designers from various categories. Here you can find tools for accessibility, prototyping, sketching, stock assets (icons, photots, etc), and a lot more. I’m pretty sure a lot of designers will find this list extremely useful.

Localstack

Localstack is a fully-functioning local AWS cloud stack. This means you can develop, run and test your AWS application offline. It supports a number of AWS services including AWS Lambda, S3, DynamoDB, Kinesis, SQS, and SNS.

Having AWS stack run locally will help you speed up and simplify the testing and development workflow of your application.

Founder Resources

A collection of resources like tools and content for those who’d like to start their journey as a business or startup founder. Being an entrepreneur is not easy. So get this list bookmarked and get prepared.

EmailValidator

A PHP library that makes it easy to validate an email address. It provides several methods of validation including validation through the email RFC, DNS, or you can also write your own validation.

Docker OSX

A Docker image that allows you to run a container with macOS. This is another cool stuff to help effectively test your application and ensure that it runs across different platforms.

Fonoster

An open-source alternative to Twilio. It allows you to run a stack application from VOIP, SMS, mail, chat, and video on your own server. A great alternative for those who’d like to have full control over their platform and the data.

Freescout

Freescout is a lightweight help desk application built with Laravel. You can use it to help and manage your customer tickets, mailbox, and conversations. It’s open-source, free, and packed with features.

Freescout is overall a great alternative to the paid-platform app like Zendesk and Help Scout, especially if you value and need control over your data.

Laravel Tenancy

A robust PHP library to set up multitenancy in Laravel. This allows you to run a single Laravel application with multiple database connections. It works seamlessly and works out-of-the-box with several popular Laravel packages like Vapor, Nova, Livewire, and a lot more.

SwiperJS

A modern JavaScript library to create a slider. Designed and intended to be used on mobile websites and apps. SwiperJS is framework agnostic which allows you to use any framework including jQuery and Zepto.

On top of that, it also provides official integration that allows it to work out-of-the-box with some of the most popular modern frameworks like Vue.js, React.js, Svelte and Angular.

The post Fresh Resources for Web Designers and Developers (November 2021) appeared first on Hongkiat.

Did you miss our previous article…
https://www.1clanek.info/?p=1309

Love a WordPress Plugin or Theme? Pay It Forward.

WordPress is an open-source application with an enormous ecosystem. The sheer number of available plugins and themes (many of them free) benefits developers and everyday users alike.

If, for example, you need a plugin to help with SEO, you’ll find plenty of options. Even if the first one you try doesn’t do everything you need, you can easily uninstall it and switch to something else. Want to update the look of your site? There are a seemingly endless supply of themes to check out.

The process of enhancing your website with a few clicks is something to behold. And it has also become second nature. If you’re a frequent user of the content management system (CMS), it’s easy to take all of this for granted.

What’s often missing is the act of sharing some love with WordPress plugin and theme authors. Many of us simply don’t take the time. But, by paying it forward, we can positively impact the people and products that help make our websites better.

Need some ideas? Keep reading for some simple ways to say “thank you”!

The Potential Impact

The WordPress developer community is highly-dependent on happy users. Whether they’re established commercial veterans or newbies sharing their first project, a simple act of gratitude from us can go a long way.

Consider a recently launched plugin or theme. It can be incredibly difficult to gain traction in a crowded marketplace. How can a WordPress product find the growth required to stick around for the long term?

Solo entrepreneurs and small agencies can’t necessarily afford to pay for publicity. That makes word-of-mouth from users especially valuable. Each shout-out could mean another handful of users who come on board. Over time, that can add up to something significant.

Even larger players can benefit. Momentum is often fleeting and can lead a product to languish. In a competitive environment, falling behind could mean a slow death. Positive feedback could be the difference in whether your favorite plugin remains actively developed.

Now that we know a little bit about what paying it forward can do, let’s look at some ways to put it into action.

Write a “Thank You” Note

So often, plugin and theme authors don’t hear from users unless something’s wrong. That makes sense, as people tend to go about their daily lives when things are working well. It’s not until a problem arises that we start to take notice.

Let’s meditate on that for a moment. As a developer, you might start to feel a bit underappreciated if you only hear the bad stuff. It could deflate your enthusiasm for sharing your work at all. Eventually, you may throw in the towel.

One simple way to counteract this is by writing a quick “thank you” note. Contact a plugin or theme developer and let them know that you enjoy the product. Point out how it made your website better and any particular features that you enjoyed.

It doesn’t have to go into great depth – even a few sentences will get your point across. But just think about the impact this positivity can have on someone’s day. It could be the affirmation they need to keep moving forward.

A sign that reads "Thank You".

Leave a Product Review

People pay attention to reviews. Whether they’re buying a new toaster or looking for a helpful WordPress plugin, the thoughts of other users can influence their decision.

Reviews especially help in a space with so many options. How, for example, can you tell which WordPress membership plugin is worth your time? Positive reviews are one way to filter out the best of the best.

Thus, if you’ve had a good experience with a plugin or theme, take a few moments and write an honest review. Point out your project goals and how the product helped you achieve them. And, if there were any shortcomings, it’s OK to mention them as well. Constructive feedback is helpful for future improvements.

Where can you leave a review? Items in the official WordPress plugin and theme repositories have designated places for feedback. If the item is part of a larger marketplace, they might also offer a reviews feature. Fail that, the product’s own website is also a possibility.

Star-shaped artwork.

Spread the Word on Social Media

Social media is a great place to sing the praises of a favorite plugin or theme. You can instantly reach a network of like-minded people who may be looking for such recommendations. In fact, there’s a Facebook group for precisely that purpose.

Again, you don’t have to go into great detail. A few words about why you like the product is more than enough.

In addition, it’s nice to tag the developer in your post. This allows them to easily find your feedback and even jump into the conversation.

Social media apps displayed on a phone.

Make a Donation or Go Pro

There are certainly many popular commercial products run by big companies. Still, a significant portion of the WordPress ecosystem is powered by solo developers or small teams.

These developers often make a lot of sacrifices to get their products out there. There’s the time spent writing code, supporting users, and marketing. And the burden can be especially large for free plugins or themes. Some trade a chance at more lucrative ventures for something they’re passionate about.

Providing a little financial support to the author of your favorite product can mean a lot. Even a small amount of money shows appreciation and may help them justify the time spent on the project.

On completely free products, you might see a call-out asking for donations. The WordPress plugin repository also provides space for this. If you have the means, dropping a few dollars into their virtual tip jar is a great gesture.

Otherwise, it may make sense to upgrade to the “pro” version, if one is available. You’ll likely gain access to more robust features and technical support. Even better is that you’ll be supporting the developer’s work. This will help them sustain the product into the future, which benefits everyone.

A person holding coins.

Support the Developers Who Support You

If you’re a WordPress plugin and theme user, think about what those items have meant to you. Have they helped you serve clients? Perhaps they’ve played a role in powering your business?

The amount of time and money you earned (and saved) because of these products can be significant. That’s an awesome thing and shouldn’t be taken lightly.

Therefore, it’s worth making the effort to sing the praises of a product you love. You’re helping other users by recommending something that might benefit them. Plus, you’re giving the author some warm-and-fuzzy feelings. It’s a win-win situation!

The post Love a WordPress Plugin or Theme? Pay It Forward. appeared first on Speckyboy Design Magazine.

Did you miss our previous article…
https://www.1clanek.info/?p=1304

Weekly News for Designers № 610

The Story Behind TryShape, a Showcase for the CSS clip-path property – A look at how you can leverage CSS to make all manner of custom shapes.
Example from The Story Behind TryShape, a Showcase for the CSS clip-path property

Projectile – A GUI-based app to help you manage your JavaScript projects.
Example from Projectile

20 Free Payment Method & Credit Card Icon Sets – Add a touch of style to your eCommerce site with this free icon set.
Example from 20 Free Payment Method & Credit Card Icon Sets

RapidSketch – Create sketch-notes online and access them anywhere.
Example from RapidSketch

Tailwind Mobile – Check out this library of mobile UI components created with Tailwind CSS.
Example from Tailwind Mobile

Can we have custom media queries, please? – How CSS custom media queries could make responsive styling easier.
Example from Can we have custom media queries, please?

The 10 Best Free WordPress Membership Plugins – Build a fully-functioning membership website with one of these free WordPress plugins.
Example from The 10 Best Free WordPress Membership Plugins

Pollen – This library of CSS variables focuses on consistent styling and rapid prototyping.
Example from Pollen

Web Designers No Longer Need to Sacrifice Performance for Beauty – How modern CSS and JavaScript can help strike a balance between looks and load times.
Example from Web Designers No Longer Need to Sacrifice Performance for Beauty

Accordion UI design – Everything you need to consider when creating accordion UIs in your projects.
Example from Accordion UI design

8 CSS & JavaScript Snippets for Creating Infographics – Examples that show how web technologies can benefit infographics.
Example from 8 CSS & JavaScript Snippets for Creating Infographics

Post Poly Application – Create and export 3D shape models via this browser-based tool.
Example from Post Poly Application

Dopefolio – Explore this “blazing fast” multipage HTML portfolio template.
Example from Dopefolio

Colors & Fonts – A color and typography system for designers. Compatible with Figma, Sketch and more.
Example from Colors & Fonts

Sail – This free CLI tool will deploy, manage and scale WordPress to the DigitalOcean cloud.
Example from Sail

50 Simple, Yet Highly Effective Logo Designs for Inspiration – Use these logos to familiarize yourself with simple logo design principles and inspiration.
Example from 50 Simple, Yet Highly Effective Logo Designs for Inspiration

The post Weekly News for Designers № 610 appeared first on Speckyboy Design Magazine.

Did you miss our previous article…
https://www.1clanek.info/?p=1287

Clients Make Too Many UX Decisions. Here’s How to Stop Them.

The boundaries between a web designer and their client can often become blurred. Designers, in an effort to please paying customers, put client feedback into action – even if it leads the project in the wrong direction.

A client may be pleased with themselves and happy to get their own way. But at what cost? The ensuing results aren’t always pretty. Crowded layouts, inaccessible design elements, and a general sloppiness can seriously harm the user experience (UX).

For example, consider a client who meddles in the design details of their eCommerce website. Leaving UX decisions regarding product layouts, calls-to-action, and hero areas to a non-designer could be disastrous for sales. And yet, any potential fallout may land squarely on your shoulders. Fair? I think not.

Therefore, it’s up to us to prevent such silliness from happening in the first place. Let’s explore some ways to keep clients at a safe distance from UX.

Define the Stakes

User experience is a critical factor for every website. Yet, clients aren’t always fully aware of what’s at stake. As is often the case, it’s up to web designers to provide some background.

It’s worth taking the time to talk about the importance of accessibility and ease of use. How the design of each element within a page needs to be measured against these factors. Oh, and the massive roles that performance and mobile compatibility play as well.

Then there’s the matter of personal preference. Clients often (and unwittingly) put their own opinions above the needs of the average user. Sometimes, implementing their preference is a detriment to everyone else.

The importance of UX and its contributing factors should be brought up from the very start. When clients are informed, they’ll be more likely to follow your lead.

Welcome Feedback, but Set Boundaries

How does a client go from providing useful feedback to taking over a designer’s job? It’s often subtle and can happen quicker than you think.

To be sure, some people insist on having control of a given situation. They may be just as likely to stand over the plumber fixing their leaky pipes as they are to pester a web designer.

In other cases, the mere fact that a client is paying good money for your services gives them a certain sense of entitlement. And although they may be well-meaning, it can lead to overstepping boundaries.

The dilemma is that getting a client’s feedback is necessary for a successful outcome. But it can also be fertile ground for such a takeover. So, how do you prevent it from happening?

The key is in setting clear guidelines. For example, defining goals for a particular item and asking for feedback based on those parameters.

Consider the hero area of a home page. Let’s say you’ve built something beautiful and need client approval. You might approach them by saying something like:

“I’ve set up the hero area, please take a look! Here is what we were hoping to achieve:

  • Introduce branding elements, including the logo, colors and fonts;
  • Encourage users to subscribe to the mailing list;
  • Mention the 20% off discount for new subscribers;
  • Keep the entire area accessible, easy-to-read and concise;

What do you think?”

The example above isn’t all-encompassing. But it puts the stated goals into a client’s mind. This helps you to narrow the scope of their feedback and (hopefully) avoid anything that distracts from the desired outcome.

A sign that reads "We Hear You."

Put UX Back Into the Hands of Experts

Don’t get me wrong – clients should absolutely be involved in the design process. It’s their brand, after all. And things usually turn out best with their input.

But the heavy lifting of UX should be done by experts like you. Your job is to turn a client’s vision into something that is highly usable. It’s about establishing a brand while helping users get to where they want to go.

If all goes well, they’ll take the path to conversion – whether that means sales, contact, or a subscription. That’s simply too important to leave to client whims.

Instead, educate and work with your clients in an effort to drive home UX best practices. Provide them with parameters to work within. The result will be a website that benefits its owner and users alike.

The post Clients Make Too Many UX Decisions. Here’s How to Stop Them. appeared first on Speckyboy Design Magazine.

What Are the Biggest Threats to Freelance Web Designers?

For freelance web designers, change is a way of life. Tools and technologies come and go, as do design trends. If anything, we may be better equipped to handle a rapidly-evolving world than most.

Take, for example, the COVID-19 pandemic. Chaotic as it has been, it’s led to some important realizations. Perhaps the biggest one is that we are indeed essential workers.

Not on the front line, mind you. But our expertise has played a vital role in helping our clients adjust to a new “normal”. We have also served as liaisons, spreading important information to the masses.

One could argue that web designers are as relevant as ever. Still, that doesn’t mean that individual freelancers are immune to the ever-shifting landscape. Long-term survival in this industry is not a guarantee.

As someone who has spent over two decades freelancing, I do see some potential threats ahead. That said, I also believe designers can prepare for them. Here are a few items to watch out for, along with ways you can mitigate their effects.

The Growing Complexity of Building Websites

Building a custom website is becoming more difficult. The development techniques behind the latest functionality trends are vast. In addition, the expectations from clients have also grown.

But, aren’t things supposed to be easier as technology improves? Well, yes and no.

WordPress is a prime example of this. The Gutenberg block editor has evolved to the point where crafting a custom page layout is relatively simple. Thankfully, extra plugins and hard-coding theme templates are no longer 100% necessary.

Yet, if you want to natively develop custom blocks, it’s not necessarily a straightforward experience. There is a steep learning curve for those who are not already proficient with JavaScript and the React library.

Then there is the whole concept of the “headless” website, where a content management system (CMS) feeds into a static HTML front end. Both the setup and maintenance processes are a whole new ballgame for many web designers.

You can still achieve quite a lot using visual, no-code tools. But going fully custom means digging deep into code. Understandably, that’s not everyone’s strong point.

How to Prepare
Experiment with different technologies and find ones that will benefit your business. That will be the key to providing your clients with cutting-edge service.

Another benefit: the more you know, the more you can charge! The ability to take on complex projects is a great way to boost your bottom line.

One-Stop Agencies

Web design is an ultra-competitive marketplace. Yet, it seems like there has always been enough work to go around. That’s a comforting thought.

But it ultimately depends on the types of clients you want to work with. For a certain level of clientele, a niche freelancer is becoming a less attractive option. Why? Because we don’t do “everything”.

Some organizations see a benefit to having all of their needs taken care of by a single provider. That means their web, print, and social media are in the hands of a one-stop agency.

The appeal is understandable. Instead of having a web designer over here, a graphic artist over there, and an SEO expert somewhere else, one company handles it all. Ideally, an agency will have a single point of contact and a more cohesive strategy.

When, for example, it’s time for a rebrand, the agency is there every step of the way. Even if the cost is higher, the ease of management may be worth the premium.

How to Prepare
Short of expanding your offerings and hiring additional people (thus, becoming an agency), competing in this area is difficult. However, there are some things you can do to stay in the game.

The first is to focus on clients who don’t require an all-encompassing level of service. There are plenty of organizations out there that will see the value in what you do.

You might also find an opportunity to work with an agency, as some utilize freelancers quite a bit. Coming on board means playing a key role in their projects. Plus, these types of gigs can become a source of recurring revenue.

People shopping at a convenience store.

Poor Business Habits

While outside threats get all the publicity, nothing can sink a freelance design career faster than poor business habits. They can lead you to lose money and, ultimately, your business.

There are several things here that can spell trouble, including:

  • Spending too much money;
  • Reliance on a single, large client;
  • Charging too little;
  • Failure to be thorough when creating project estimates;
  • Providing poor customer service;
  • Leaving yourself open to legal liability;

Quite often, it’s not a lack of talent or even a saturated market that kills a web design business. Rather, carelessness can be the biggest culprit. The seemingly small details of running a business mean a lot.

How to Prepare
Running a freelance web design business requires a lot of discipline. Therefore, it pays to be organized and develop processes for every aspect of the job.

In practice, this means accurately keeping track of finances, staying on top of ongoing projects, effectively communicating with clients, and general awareness of where your business stands. This will keep you vigilant and less likely to be taken by surprise.

A cluttered office.

Control What You Can

Some threats to freelance web designers are beyond our control. Market trends and the whims of clients are chief among them. Add to that the ever-growing complexity that defines what a website is and should be. Here, all we can do is try and keep pace.

However, there are many things we can control. We can choose to learn new skills that keep us on par with industry standards. This ensures that we won’t fall behind the curve when it comes to top-notch design and functionality.

In addition, we can run our businesses like a well-oiled machine. Doing so will allow us to stay organized and make the most of the opportunities that come our way. We may even recognize new ones that we wouldn’t have before.

Most importantly, we can choose the direction we want our business to go. This means further developing a niche and recruiting clients who fit our vision. The idea is to find clients who will benefit from our expertise and help them grow.

Yes, there are some existential threats to freelancers lurking out there. But with the right approach, they’ll end up as little more than bumps in the road.

The post What Are the Biggest Threats to Freelance Web Designers? appeared first on Speckyboy Design Magazine.

Did you miss our previous article…
https://www.1clanek.info/?p=1282

Create Content That Targets Your Existing Design Clients

When it comes to marketing your freelance web design business, it’s easy to spend the bulk of your energy on attracting new clients. That’s certainly a worthwhile pursuit. But it’s also important to focus on your existing ones as well.

There is great value in keeping existing clients in the loop. And not just from a marketing perspective. Sharing content of interest with them also helps to maintain your relationship.

Even if you haven’t worked with someone for a while, regular communication makes an impact. At the very least, it keeps you in the front of their mind. Down the road, it may even serve as a catalyst for starting up a new project together.

Despite those potential benefits, staying in touch can be difficult. Creating original content takes precious time. Plus, writing doesn’t come naturally for everyone. Figuring out what to say and how to say it is challenging.

Don’t be discouraged! Today, we’ll share some tips for writing informative content that is sure to pique your client’s interest.

Understand Your Audience

Writing for your existing design clients isn’t quite the same as trying to reach prospective ones. Just as you’d greet a longtime friend differently than a stranger, you’ll want to communicate with clients on a more personal level.

That means keeping the cheesy sales pitches to a minimum. It’s safe to assume that your clients are already sold on you and what you can do for their organization. Thus, there’s no need to reel in a fish you’ve already caught.

With that in mind, think about the most effective ways to communicate with your clients. The message is important, but so is the medium. It’s vital to meet people where they are, rather than expect them to come to you.

Social media has its place, but it’s probably not the best way to reach clients. Blogging can also be beneficial, but needs help to draw in your audience.

That leaves email as the best option. It’s often the preferred method of contact between designers and their clients. Sending your latest client-focused content serves as a natural extension.

Write from Experience

Web design is an industry that is constantly changing. This means that subject matter for client communication is all around you.

To find inspiration, look back at past experiences. Think about a website you built a few years ago. Compare the look, features, and process to the one you built more recently. How have things changed? What trends have emerged?

Odds are, those older sites are lacking in some areas. Must-have attributes such as accessibility and responsive design are common examples. And, even if they were previously implemented, it’s likely they could benefit from some modernization.

These are prime subjects to share with clients. Not everyone is aware of technological shifts. Having access to this information will allow them to stay up-to-date and make better decisions.

A person types on a laptop computer.

Explain the Impact

Informing clients about a particular subject is only part of the equation. It’s also important to explain how it impacts them.

For example, you might write a blog post touting accessibility standards. While an article about color contrast ratios and ALT attributes could go into great depth, clients are unlikely to read it without context.

First, they need to know why they should care about these subjects. In this case, you’d want to mention key points, such as:

  • Who is impacted when a website isn’t accessible;
  • What features make a website accessible;
  • How to know if your website is accessible or not;
  • The potential legal ramifications;

The idea isn’t necessarily to bombard them with facts or scare tactics. Rather, it’s about providing a brief description of a subject and how it relates to their website. If they’re interested, invite them to contact you for more information.

A group of people view a computer screen.

Stay on Schedule

Sending out communications regularly helps to keep your relationships going strong. Yet, it might also be the most difficult part of the process.

If you’re busy working on projects or trying to attract new clients, that leaves little time to reach out to existing ones. We tend to focus on the squeakiest of wheels, after all.

However, there’s no need to put too much pressure on yourself. You don’t have to write all that frequently. Monthly or even quarterly newsletters can still be effective.

The point is in making an honest effort to stay in touch and provide relevant information. It’s something that clients will appreciate. They’ll be more likely to stay with you as their needs evolve.

A wall calendar.

Maintaining Relationships, Fostering Growth

Your web design clients can bring significant value to your business over time. Unlike other industries, building a website is not a “one-and-done” scenario. Maintenance, content tweaks and redesigns are all part of the deal.

The best way to achieve that long-term value is by being proactive in your communication. Keep your clients informed on what’s happening and how it impacts them. Write content that sparks curiosity and encourages them to contact you. And meet them where they are.

By doing so, you’re giving them every reason to stay involved with their website and make improvements. It’s no longer a matter of waiting for clients to ask you for something – you’re now helping them figure out what they need.

This, as much as anything, will keep your freelance business thriving for years to come.

The post Create Content That Targets Your Existing Design Clients appeared first on Speckyboy Design Magazine.

Did you miss our previous article…
https://www.1clanek.info/?p=1278