1stWebDesigner https://1stwebdesigner.com Helping You Build a Better Web Mon, 24 Jun 2019 13:55:53 +0000 en-US hourly 1 https://wordpress.org/?v=5.2.2 The Top 5 Myths About Being a Freelance Web Designer https://1stwebdesigner.com/the-top-5-myths-about-being-a-freelance-web-designer/ Mon, 24 Jun 2019 13:55:53 +0000 https://1stwebdesigner.com/?p=148344 Starting a business is one of the biggest leaps of faith you’ll ever take. And it seems like more people in the web design and development fields make this move every day.

Why? Well, it’s an attractive proposition. Web design isn’t a particularly expensive business to get into. While you can use brand-name tools, there are plenty of free and low-cost alternatives. Server space is relatively cheap. And, so long as you have a decent broadband connection, you can work from home.

With such a low barrier for entry, working as a freelancer has become quite a mainstream thing to do. However, when I started my business back in 1999, I got used to seeing stunned reactions from people when they learned that I worked for myself in my own home office. My, how times have changed.

Yet, one thing that hasn’t quite evolved are the myths associated with freelancing. When speaking with folks who are thinking of taking the plunge or just starting their journey, I often hear many of the same assumptions that I myself put forth many years earlier.

As many of these notions are still prevalent, I thought it would be worthwhile to examine a few of the most common ones a little more closely and set the record straight.

Myth #1: You Can Work Whenever You Want

One of the most common misconceptions about being a freelance web designer is that you can simply set any type of work schedule you like. For instance, you might want to set your regular business hours in the evening, because that’s when you feel most productive. However, depending on the type of clients you hope to attract, this isn’t always realistic.

As my business got off the ground, I assumed that I could go missing for several hours during the day and just make up for the time later on. But it didn’t take long to realize that my clients worked a normal business day, and they expected me to be available throughout that time.

Taking care of clients is one of the biggest keys to finding success. Therefore, it’s important to consider their needs when determining your work schedule. It may be possible to keep those evening hours, but then again it may not.

A man working on a laptop, while sitting on a park bench at night.

Myth #2: You’ll Make Lots of Money Right Away

Earnings potential is a big reason why you may decide to go freelance. But the key word here is potential. Certainly, it’s possible to make a good living. However, it usually doesn’t happen overnight.

There are so many factors that go into a freelancer’s income. Your skill/experience level, specialties and the type of projects you book all play a role. If you tend to work with locally-based clients, your market can also affect how much you make.

And even if you have talent and desirable skills, it can still take several years of very steady work to raise your income to a comfortable level. It is very much an attainable goal – just don’t expect to get there instantly (without a million-dollar idea, anyway).

Instead of trying to get rich quickly, focus on building a roster of clients who can provide you with recurring work and revenue. This approach may be slower, but it also provides the foundation you need in order to grow.

A man holding a piggy bank.

Myth #3: There’ll Be No More ‘Boss’

Freelancers love to say that we are our “own boss”. That’s true, in the sense that ultimately, it’s up to us to make all of the hard decisions. And sure, nobody is necessarily standing over our shoulder, watching us work.

But in my experience, it became evident early on that I no longer had a single boss – but several. I’ve found that each client fills a similar role in their own way. Instead of having to please perhaps just one or two people, I now have to consistently please dozens different entities.

This can be quite difficult to pull off. You need good organization and communication skills, along with a solid work ethic. Otherwise, you may just have several bosses yelling at you – as opposed to that single figure with the corner office.

A security camera.

Myth #4: You Can Fully Focus on Doing What You Love

When you work for someone else, it can be frustrating when you’re stuck performing tasks that you don’t enjoy. If you love being creative or solving problems through code, then you probably loathe engaging in “grunt work”.

Freelancing can be seen as an escape from that – only it’s not. In fact, you are not only responsible for the menial tasks related to your actual job, but the ones related to running a business as well. Bookkeeping, marketing and customer service may not be your cup of tea – but they’re most likely going to find their way into your daily agenda.

The only way to avoid some of these tasks is to hire someone else to take care of them. It just takes the financial resources to do so – something not everyone has. This is especially true early on.

Therefore, it’s best to create processes to do these no-fun tasks in the most efficient way possible. That will at least save you some extra time to tackle the fun stuff.

Financial documents on a desk.

Myth #5: You Know Exactly What You’re Getting Into

When starting my business, I did so without so much as a plan. Whether it was hubris or just plain ignorance, I believed that I knew what I was doing. But I was in for some important lessons.

The fact is, I didn’t know nearly as much as I’d thought. And, more than 20 years on, I can now sit back and laugh at how sure of myself I was back then. There have been so many highs and lows, along with truly valuable experiences. Not to mention some amazing relationships that have come along the way. In all, it’s been very humbling.

The point being that, no matter what we think will happen, running a business tends to take a lot of unexpected twists and turns. And it can actually be a very positive thing. It can take you outside of your comfort zone and make you even better at what you do.

A woman reviewing business strategy.

Fact: You Can Do It!

Maybe some of the myths mentioned above sound scary – and they are. Starting off on your own isn’t exactly the easiest thing. It’s full of risks and things don’t always work out the way you hope.

But, as they say, nothing worth doing is easy. Just keep in mind that it takes patience, commitment and talent to succeed over the long haul. An open mind helps, too.

So, don’t let those challenges stop you from taking a chance. Instead, use them as motivation to achieve your goals.

]]>
Copy-and-Paste CSS Animation Cheat Sheets https://1stwebdesigner.com/copy-and-paste-css-animation-cheat-sheets/ Wed, 19 Jun 2019 20:28:59 +0000 https://1stwebdesigner.com/?p=148754 Animation is a staple of web and UI design. A perfectly still website devoid of even subtle hover states can feel incomplete, like something essential is missing.

Luckily, there are many ways to add animations to your website. WebGL, JavaScript, and even HTML5 all support or are dedicated to animation. But one of the easiest to learn and implement are CSS animations.

Flash was another source of lightweight, easy to create animations for websites. But with Flash being finally deprecated, many designers are turning to CSS to enhance their websites with beautiful motion graphics.

While CSS animation is easy to learn as far as web animation platforms go, it can still take a lot of time to master it. And it can really help to have some example code to learn from and use in the meantime.

Today we’ve collected for you some copy-and-paste cheat sheets for CSS animations. If you need some beautiful animations to include in your design, quick code for a test website, or want to learn from the code snippets provided, you’ll love this collection of animations.

CSSFX

Example from CSSFX

With dozens of beautifully clean animations, CSSFX offers a great start for those who need small and simple effects for their site. In particular you’ll find a lot of interesting loading animations and quite a few hover states as well. Just click the ones you like to copy their code and see for yourself how they did it.

Animista

Example from Animista

Need something with a little more customization? Animista has nearly 20 types of CSS animations to browse, each coming with tons of extra settings to change to your liking. Add animations you want to save to your favorites, then click the generate button to get the code.

Epic Spinners

Example from Epic Spinners

Everyone loves spinners. They’re cute, fun to look at, and they can keep people interested for the few seconds it takes a page to load. Or they just make great page decorations! Click a spinner to see its code, and use it with Vue.js too.

Easing Functions Cheat Sheet

Example from Easing Functions Cheat Sheet

An easing function explains how an animation accelerates and decelerates throughout the frames. Animations can move linearly, smoothly, or even bounce rapidly back and forth.

A linear animation with no easing of any kind is often boring. Use this easing function cheat sheet to easily create unique and smooth animations.

Transformicons

Example from Transformicons

Transformicons are icons that shift between states when clicked. A few extra icons like loading bars and scroll indicators are included as well. Just click to see a preview of the icon in action, and toggle to select the ones you want to build code for.

These CSS icons do use a little JavaScript, but it’s only a few extra lines. The clean animated buttons are more than worth it.

CSS Animation Made Easy

Every site could use a little movement. Too much animation can be jarring depending on the style of website you have, but subtle animations like parallax and CSS can add style without being distracting.

CSS animations work so universally well because they’re simple and subtle, while still adding a lot of personality. Other types of animation can also add bloat and cause a site to slow down for some users, but CSS is quick and light on users’ systems.

Cheat sheets are a big help to animators and web designers both. For UI designers, it’s useful to see clean code in action. Creating your own code becomes much easier with a reference. And for those unfamiliar with CSS animation, you can still get the benefit of beautiful motion graphics.

So, make sure to try out these beautiful animations for yourself. Add them to your website and see how they can enhance your design.

]]>
Interactive CSS Grid Layout Generators https://1stwebdesigner.com/interactive-css-grid-layout-generators/ Mon, 17 Jun 2019 13:14:06 +0000 https://1stwebdesigner.com/?p=148636 For as long as CSS has existed, web developers have struggled to design layouts with it. Positioning elements on a page has never been easy and usually involved a workaround like using floats or tables, instead of having a CSS system designed just for that purpose.

All that changes with the advent of CSS grids, which have only recently been adopted by all major browsers. Finally, there exists an easy way to create two-dimensional layouts on a webpage, and position elements within them. No more convoluted workarounds for such a simple issue.

There’s just one problem with CSS grids: many developers, especially newer ones, are having trouble learning how to use them! If you struggle with flexboxes, then learning grids might seem like an impossible task.

Luckily, other developers are here to save the internet with their grid layout generators. Just point and click or fill out some boxes and you have a frame to work with.

Here’s a collection of a few great grid generators, from very simple layout makers to ones that touch on much more complex features of the CSS system.

CSS Grid Generator

CSS Grid Generator

First up is the simple but effective CSS Grid Generator. No frills or confusing addons, just create a grid, tweak some numbers, and stick the code in your website, simple as that. If you’re new to CSS grids, this is a great tool to get started with.

Griddy

Griddy

Griddy is a helpful CSS grid generator which allows you to add as many elements as you want and size them based on row or column size. You can size them on fractionals (fr), pixels, percent, or auto – and you’re not locked to using one unit for the whole grid. Have two columns using fr and carefully size the others with pixels!

LayoutIt

LayoutIt

With LayoutIt you can easily create grids of any size, and even place grids inside other grids. Add more columns and rows as you need them, inside and outside individual boxes, and get full control over the layouts you create.

Grid Wiz

Grid Wiz

This is a tool for advanced users ready to learn more about CSS grids. Grid Wiz isn’t just a simple generator. You can edit code right in the sidebar and see it update in real time. Then download it, or add Grid Wiz as a dependency and compile it.

cssgr.id

cssgr.id

One of the most flexible CSS layout generators out there, cssgr.id presents you with plenty of options to get started. There are five starter layouts to begin with, and you can add as many items, columns, and rows as you want. There’s even a placeholder text option so you can see how this layout will look in action.

Easily Make Grids in CSS

Web developers are always making strides towards a better, more efficient internet backend. CSS grids are just among the latest developments, and it’s finally solved a long-standing issue that’s plagued CSS designers.

CSS grids have actually been around since they were proposed in 2011, but it wasn’t until 2017 that all the major browsers finally adopted support for them.

Now that developers no longer have to be wary of using them, there’s been a ton of CSS grid guides, tutorials, and resources made, just like these layout generators. So, if you’re still using a workaround like flexboxes or even floats to design webpages, consider trying out grids instead. There’s plenty of support online to help you learn them.

And if you’re still learning to use grid layouts, check out this comprehensive guide to get you started!

]]>
12 Outstanding Free Fonts for Minimal Blogs and Websites https://1stwebdesigner.com/12-outstanding-free-fonts-for-minimal-blogs-and-websites/ Thu, 13 Jun 2019 13:22:06 +0000 https://1stwebdesigner.com/?p=148467 There is a seemingly endless supply of crazy fonts to choose from. But few of those fonts are actually good for a blog or website. Minimal and simple fonts make great headers and body text for a website that wants to be clean and readable. With 58% of people visiting webpages on mobile devices, it’s important that web fonts be very legible even at small sizes. These fonts are all geometrically sound, have well-thought-out spacing and kerning, and were often specifically designed for screens.

What fonts look good where is often fairly subjective, but most people can appreciate a good minimal font. We live in a cluttered world with a lot of distractions, so simple fonts are seeing a revival in web design.

Here are 12 of the best free fonts for minimal blogs and websites!

Montserrat

Example of Montserrat

Montserrat is a sans serif font that tends to be on the thinner side. It has a bit of personality, with the inspiration coming from signage in the Montserrat neighborhood of Buenos Aires. Certain characters such as the capital ‘J’, and the capital ‘R’ have special aspects that make this font really stand out, despite being minimalist. You’ll always recognize the use of Montserrat in a webpage, with iconic curves and lines.

Source Sans Pro

Example of Source Sans Pro

Source Sans Pro is another sans serif mainstay that was specifically designed to work well in user interfaces. This makes it the perfect font for blogs and websites. Most of the characters are very simple, straightforward, and balanced. It was inspired by gothic fonts, but spread out the character’s elements vertically and horizontally, to increase readability.

Simplifica

Example of Simplifica

The Simplifica typeface is a somewhat condensed sans serif font. It has very consistent character heights, to increase readability. This font flows easily and legibly across any webpage. It really shows off why the word “simple” is in the name. The tall character heights make for a smashed-together look, but the wide variety of ascenders and descenders provide enough interest to prevent Simplifica from being hard to read.

Blogger Sans

Example of Blogger Sans

Blogger Sans was designed for website headers, and focuses on legibility. Some characters are shorter or more compact, which means this font is great for headings with small line spacings. While many minimalist fonts involve just straight lines, Blogger Sans employs more rounded corners. It’s a slippery slope to Comic Sans from here, so use something like this only when very appropriate.

Caviar Dreams

Example of Caviar Dreams

Caviar dreams is a thinner sans serif font that features a lot of straight lines and a few surprises. The lowercase ‘e’ in particular has a 45-degree angle line that adds a lot of personality to any header text you use this on. The “caviar” in the name makes this font seem ideal for elegant looks, and its clean lines would certainly imply that as well.

Quicksand

Example of Quicksand

Quicksand is designed for display purposes but is still legible at small sizes. It has rounded terminals, which makes it easy to read whether using light or bold styles. Overall, it is based on geometric shapes, so all of the characters just make sense when seen together. It is clear that the entire font is based around a few curves, and lines jutting out of those curves in a deliberate fashion.

Roboto

Example of Roboto

The Roboto font has a geometric core that also features a lot of open spaces to increase readability. This typeface lets characters take up their natural amount of space, rather than forcing a grid. That makes Roboto easy to read on a webpage, and look pleasing to the eyes at the same time.

Lato

Example of Lato

Lato was originally conceived for corporate logos, which is probably why it works so well as a professional-looking blog or website font. It is a sans serif font that has a fairly timeless, simple design. Its simplicity makes it great for body text, but stands out enough with some unique characters and rounded elements, to be a great header font as well.

Oswald

Example of Oswald

Oswald is a play on Alternate Gothic sans serif fonts, and was optimized for digital displays. All of the characters are well-balanced with a combination of straight lines and rounded details. The letters have a very tight spacing between them, but everything is still legible at a small size. The entire font has an “upwards” feeling to it, making it seem tall and strong.

Raleway

Example of Raleway

Raleway was designed for headings and other large usages. It is a sans serif font that comes with a unique look – some of the numbers have additional ascenders and descenders that can give some special character to a heading, although that doesn’t work for every situation.

Merriweather

Example of Merriweather

Merriweather is a serif font, but one that works nicely for web display. It was specifically created for being easily read on screens. The serifs make the font appear sturdy and strong, while a taller overall design gives plenty of room to legibly read this typeface. This makes a great, subtle replacement for a classic font like Times New Roman, which is similar in many ways.

Playfair Display

Example of Playfair Display

Playfair is a stylistic serif font that works great on any website trying to convey a sense of elegance. This font is elegant while not sacrificing simplicity. There are just enough details and unique serifs to make it exciting. It feels like an old, classical font, while still maintaining modern sensibilities. Most sans serif fonts will pair nicely as body text, with Playfair used for headings.

Fonts That Add Simple Personality

Quite often, simple, no-frills fonts are more effective than their over-the-top counterparts. The selections above enable you to make a statement in a clean, simplistic manner. That, in turn, will allow your content to speak for itself.

]]>
Top Web Design Tools and Resources https://1stwebdesigner.com/top-web-design-tools-and-resources/ Wed, 12 Jun 2019 12:17:41 +0000 https://1stwebdesigner.com/?p=148555 Are you a web design freelancer, a team, or heading up a design agency? Then, you’re always looking for ways to improve productivity. You also try to advance the quality of your products.

This ongoing quest for improvement is never-ending. It includes tips for keeping abreast of the latest digital technologies. It also involves a constant search for the best tools and resources you can get your hands on.

There’s no shortage of quality tools and resources. Quite the opposite is true. The problem you face is that some are better than others. You have to devote an extensive amount of time searching for those that will serve you best.

This selection of top tools and resources for 2019 should make your search a quick and easy one.

Elementor

Elementor

Its 2 million active installs more than backs up the claim that Elementor is the world’s leading and most advanced WordPress page builder on the market.

Its drag and drop page builder is quick and powerful, its interface is intuitive, and the wealth of features it brings to the table can significantly streamline and shorten web designers’ workflows. With Elementor, creating the perfect website to promote your message is quick, painless, and requires no coding.

Use any of Elementor’s 100+ pre-designed templates to get a project off to a fast start, or design from scratch in which case you have a host of widgets and other design aids at your fingertips to speed the process along.

While you can take full advantage of this web-building tool’s extreme flexibility to create virtually any type of website you want, Elementor works perfectly with any theme and plugin. Plus, several cool new features have been added including pop-up and advanced form builders, hover and scroll animations, MailChimp and HubSpot integrations, and more.

Be Theme

Be Theme

There are few if any WordPress themes on the market that enable you to create a quality website of any type or for any business niche as quickly and easily as BeTheme can do. You don’t have to start from scratch, and you don’t have to use code thanks to Be’s impressive selection of core features.

The star of the show has to be its library of more than 400 pre-built websites. These pre-built websites address all industry sectors and website types. Each website is customizable, can be installed with a single click, and provides a solid foundation for high-quality UI and UX designs.

The shortcode library, a shortcode generator, options panel, a brand-new Header Builder, and the Muffin Builder ensure you will never need to use a single line of code. BeTheme can make building a complex, responsive, SEO-friendly website in as little as 4 hours a reality.

wpDataTables

wpDataTables

With this all-in-one table and chart building solution, you can download huge amounts of complex data and in minutes, if not seconds, create informative and eye-popping charts and tables to present to your website visitors.

The wpDataTables plugin is currently producing charts and tables for more than 21,000 happy users; users who have given it a 4.7+ average rating.

In addition to being able to work with data in all the common formats and widely available sources, wpDataTables offers the only solution that fully supports and easily manages SQL database queries.

wpDataTables features include a selection of eye-candy skins (4, with more to come), color coding and highlighting thanks to the conditional formatting feature, total customization of table designs, and front-end editing of table data.

This premier table and chart building solution can be yours at a 30% coupon discount (code WPDTJUN8413) from now to mid-July.

Uncode

Uncode

Uncode is a professionally-designed, pixel-perfect theme that offers unparalleled flexibility and performance. Select from its library of design concepts to get a stunning website up and running in a few short hours. Visit Uncode’s website and view its collection of user-built websites.

You’ll come away with a solid understanding of what this WordPress theme can do for you and why, with over 50,000 sales, it’s one of ThemeForest’s all-time top sellers.

Nutcache

Nutcache

Nutcache is an all-in-one productivity tool design teams or freelancers can put to good use for their task and time tracking and budget monitoring and invoicing needs. Because of this tool’s flexibility, it adapts easily to project workflows and helps to streamline them. Team members and project stakeholders will benefit from Nutcache’s collaboration, feedback, and approval features.

Amelia

Amelia

Businesses in need of a smoothly functioning appointment booking and management system will absolutely love Amelia. Amelia saves businesses time and money by fully automating these processes. It can book appointments 24/7, match customer needs to employee availability, manage changes and cancellations, and accept online payments. A new Events module enables Amelia to serve as an events calendar as well.

Amelia easily integrates with WooCommerce, Google Calendar, and other business-oriented external systems. Use coupon code AMELIAJUNE5235 for a 30% discount through mid-July.

Dr. Link Check

Dr. Link Check

Dr. Link Check tracks down broken and malicious links that could pose a threat to or significantly downgrade the performance of a website or in a worst-case scenario cause it to be blacklisted. It checks for proper URL formatting, server response time, SSL certificate validity and more, and informs you of needed changes.

You can schedule monthly, weekly, or daily checks of your website. Dr. Link check will notify you of its findings and analysis by email.

Houzez

Houzez

Houzez is chock-full of the features and functions realtors and agencies require as they go about their daily business, whether out conducting showings or in the office. This drag and drop-based specialty theme provides its users with advanced search capabilities, multiple listings display options, a property management system, and property showings scheduling.

Houzez can easily be adapted to a real estate agency’s business model.

Mobirise Website Builder

Mobirise Website Builder

Mobirise is an easy to use, drag and drop, and mobile friendly website builder. This offline app is free for both commercial and personal use. Since you’re not tied to a specific platform you have total control over your design, and you can host your website wherever you want.

Mobirise, with its huge library of trendy website blocks, templates, icons, fonts, and images, has been used to create more than 1.5 million sites to date.

goodiewebsite

goodiewebsite

goodiewebsite is a cost-effective platform that connects business website owners and web designers with web developers. It offers an ideal solution for anyone needing front-end development of small to medium (1 to 10-page) websites.

With goodiewebsite, you can expect quality deliverables based on more than 12 years of software development experience.

Stockfresh

Stockfresh

Stockfresh offers millions of hand-picked, royalty-free stock photos and vector images at affordable, competitive prices. The Stockfresh website is easy to work with and navigate. Photos and images are “you see what you get” except of course the Stockfresh watermark that appears on some has been removed on the downloaded files. Stockfresh plans to increase its offerings to include templates, fonts, and other design goodies

Subscribe to any plan at a 20% discount (use code BLKFRD17).

Savah App

Savah App

Savah App is an advanced prototyping tool for web and mobile app designers. It can be put to excellent use from one end of a project to the other. Apply it to build simple prototypes for design concept feedback and approval, mid-design phase rapid prototyping, and high-fidelity interactive prototypes for user testing and design sign off.

Several monthly paid plans are available, or you can subscribe to an annual plan at a 30% discount.

Rank Math SEO

Rank Math SEO

What would you expect to find in a Swiss Army knife of SEO tools? Everything you need for on-page SEO for starters, plus WooCommerce SEO, Local SEO, an SEO analysis tool, Sitemaps, AMP, and more.

The Rank Math SEO tool even includes a content-analysis capability you can use to help you write SEO-friendly content. This useful tool addresses an aspect of web design many find quite challenging. It’s powerful and easy to use.

WP Review Pro

WP Review Pro

With WP Review Pro you can spice up your eCommerce website by including information that most customers consider to be of great value – product reviews and product comparisons.

This WooCommerce-compatible, speed-optimized tool’s advanced options panel lets you choose among and present multiple rating systems, including 5-star rating. You can also integrate with Facebook customer reviews, a feature that can play a key role in boosting website conversions.

8b Website Builder

8b Website Builder

What can you expect from a brand new (January 2019) mobile website featuring a super-simple and futuristic UI? Lightning speed for one thing. Google AMP guarantees that. Get listed on Google with a single click. Create a website at home or on the go on your mobile device.

Link to your own domain or use 8b.io. That’s just for starters, and 8b is, at the moment, free.

Easy Ways to Level up Your Game

Select just one of these tools, themes, or resources. The impact you can expect on your website design capabilities should make your day. Pick several, and who knows what you could accomplish.

A quality WordPress theme plus a couple of specialty plugins can do magic. These could enable you to turn out one stunning, award-winning website after another. Since there are several free items to try, there’s really no excuse for letting them slip by.

]]>
Design Studio & Agency Website Inspiration https://1stwebdesigner.com/design-studio-agency-website-inspiration/ Mon, 10 Jun 2019 15:27:55 +0000 https://1stwebdesigner.com/?p=148450 If you’re taking on the huge task of designing a studio or agency’s website, it’s important that you get everything just right. Professionalism and ease of navigation needs to balanced perfectly against beautiful design and modern trends.

If you need a little inspiration for this undertaking, we’ve got a few amazing websites to show you. These agency sites are exceedingly well made, so see what you can learn from these impeccable designs.

Dogstudio

Image from Dogstudio

Dogstudio nails its branding by designing a website around its wolf-like character. Everywhere you explore, the beautifully animated dog follows you, changing color, rotating, and moving around the screen. It’s an amazing display of interactivity and 3D web animation.

Everest

Image from Everest

Design studios have lots of content to show off, so it’s important to have good navigation. Everest does it right with a beautiful and functional homepage that takes you through the company’s work. Click something you’re interested in and it smoothly transitions to a whole new area to explore.

Rally

Image from Rally

If you’re not sure where to start with a design, try using consistency. This studio’s homepage is made up of a spiral that changes color as you scroll through each project. The colorful ribbon remains on other pages and stretches as you navigate between them.

Okalpha

Image from Okalpha

Websites for agencies are often dark and serious. But that doesn’t mean you can’t have fun with your design! Okalpha’s site is bright and colorful, with a flat look and cartoonish hues. It’s the perfect fit for an upbeat animation studio.

Canvas United

Image from Canvas United

This site is all about clean and interesting UI. There’s plenty of elegant hover and transition animations – even the loading screen includes a beautiful animated logo! The flawless UI design leaves a lasting impression of quality and grace.

Feral

Image from Feral

Many websites opt for digital icons or photography rather than illustrations, but Feral’s website proves that they have a place in web design. Lively sketches are scattered absolutely everywhere, and it makes the site seem unique and personalized.

UIX

Image from UIX

Studios need a good portfolio, and UIX does it perfectly. Widescreen images allow you to get a good look at their work, with quick animations keeping you interested in the content. Short paragraphs and impactful blurbs are broken up with more visual examples. It allows you to get an in-depth look at their design choices and see if the company is the right fit for you.

Prokhorov Design

Image from Prokhorov Design

For portfolio sites, a simple but strong design often works best. This site uses a background of particles that shift into different shapes, while also leaving a comfortable amount of space. Click on a project and the site becomes much more compact as it takes you through the creative process of designing an app.

Visual Soldiers

Image from Visual Soldiers

Content-packed boxes make up this website’s design with links and articles appearing inside them. Click one to explore this colorful site as you navigate through portfolio pieces, articles, and videos.

Hoffman

Image from Hoffman

Nothing hooks people more than a charming intro video, and there’s plenty of interesting photos and videos to be found on this website. Explore to learn more about a company’s branding campaign, and be stunned at the perfectly synergistic design.

Rise

Image from Rise

Though many brands’ websites go over the top with flashy elements and animations, clean and simple design shouldn’t be forgotten! Rise uses space and simplicity to create a breathable website that uses contrast to call attention to important areas. It’s a solid look that gives a sense of reliability.

RFTB Creative Digital Agency

Image from RFTB Creative Digital Agency

If one site inspires you, it should definitely be this one. The building music and slowly scrolling video background create a sense of wonder and curiosity. Follow that up with other great background videos, leading you to plenty of interesting excerpts and you’re already hooked.

Creating Gorgeous and Professional Websites

When you’re creating a site for a professional studio, your main goal is to hook potential customers – and a website that’s beautiful and inspiring is more likely to charm visitors and get them interested in the company.

These twelve great website examples gracefully capture their agency’s vision, all while creating a site that’s easy to navigate and fun to explore. There’s a lot to learn from these designers.

]]>
How to Find a Marketplace to Sell Your Designs https://1stwebdesigner.com/how-to-find-a-marketplace-to-sell-your-designs/ Wed, 05 Jun 2019 13:26:08 +0000 https://1stwebdesigner.com/?p=148182 Once you have finished your batch of logos, website design, or whatever creative work you made, you need a marketplace to sell it on. There are a vast number of websites out there for you to choose from.

Selling your designs is a very easy way to make some extra money and to expand your brand. Whether you are an illustrator, 3D artist or logo maker, there is a demand for your creative work.

There is no longer a need to build your own website to sell designs. Now, it is easier than ever to list your work on ecommerce websites to help you reach thousands (if not millions) of people. This article will help you find the one that best suits your needs.

Creative Market

Screen from Creative Market

“Empowering creators to make a living doing what they love” is a phrase that Creative Market uses to describe what they offer and this holds very true. Creative Market has a network of about 5.9 million potential customers that could be interested in purchasing your work.

This marketplace is used to sell graphics, WordPress themes, stock photos, and many other digital goods. There are many success stories from sellers using Creative Market to sell their goods and making a lot of money doing so. Stories such as Nicky Laatz, a South African shop owner, who has earned more than $1,000,000 selling her work on Creative Market.

Envato Elements

Screen from Envato Elements

Envato Elements is a digital marketplace that allows creators to sell multiple digital goods such as graphics, fonts, WordPress themes, web templates and photos – along with many more digital items.

The company believes in supporting independent designers and that when the community succeeds, the company succeeds. With this belief they share an even 50% of the net revenue with their designers and sellers. This marketplace is driven exclusively by the community of designers who sell their work with them. Envato Elements is a great way to get paid for your creative work.

DesignCuts

Screen from DesignCuts

DesignCuts is a digital marketplace that is driven by the community. They are very selective in who they allow to sell on their marketplace. Taking a visit to their website, you will see the quote “We’re very exclusive and work with only the best designers in the world, curating the highest quality marketplace around.”

This means it is tough to become a seller on their marketplace. But once you do, you will be part of a small group who has access to a large share of potential customers.

The Hungry JPEG

Screen from The Hungry JPEG

The Hungry JPEG began in late 2014 as a website to help designers and crafters navigate the design world. By mid-2015, they launched a shop to give designers a way to make money from their craft.

They offer a wide range of products, from handmade goods to website templates. If you choose to sell on The Hungry JPEG, you will earn 70% of every sale you make – one of the highest numbers of all the websites on this list.

Also, they do not ask for an exclusivity deal – meaning you can list your products on their website and any other websites of your choosing. They also offer an automated product delivery system so your items are always selling, even when you are away.

YouWorkForThem

Screen from YouWorkForThem

YouWorkForThem has been around since 2001 and is one of the oldest online marketplaces. They are privately owned and run by a group of designers who know what is best for the designer.

They are used by many major brands such as Nike, Coca-Cola, Whole Foods Market, Starbucks, Amazon, Samsung and many others. YouWorkForThem splits the profits 50/50 with all the designers who sell fonts and stock art. On top of that, they will market your designs on their social media outlets, like Facebook and Twitter, that have a combined audience of nearly 80,000 people.

Etsy

Screen from Etsy

Etsy is one of the largest global marketplaces around. With a concentration on handmade goods, jewelry, and clothing, you can also find digital goods such as website designs.

They are also one of the easiest places to sell your work, but this ease and large user base also creates more competition. Etsy does offer affordable ways to list your work with prices as low as $0.20. With the many tools that Etsy provides, it is very possible to become a successful seller on their website.

Society6

Screen from Society6

Society6 is very similar to Etsy in that it focuses on selling handmade crafts and goods. Their market mostly consists of artwork that goes on products like mugs, phone cases, and t-shirts. This is the place to get your work in front of thousands of people and a network that grows every day.

Template Monster

Screen from Template Monster

Template Monster has been in business since 2002 and from the get-go they changed the way websites are built. They specialize in offering web templates and other related digital goods.

You’ll find WordPress themes and plugins, CMS templates, fonts, and illustrations along with many more digital products to sell and buy. Every month they add nearly 400 new products in all the categories mentioned above.

They also offer 24/7 customer support for sellers and buyers, making it easy to handle any problems you may come across when using their marketplace.

Big Cartel

Screen from Big Cartel

Big Cartel has been around for 14 years and in that time, they have helped artists sell over $2.5 billion in creative work. They enable sellers to create their own store with many customizable features to make the experience as personal as possible.

The freedom they allow you to have with selling your work is everything a designer could want from a marketplace.

The Power of Community

One of the common threads of each of the marketplaces above is their reliance on a community. The strength of these virtual places, and the work they produce, is what keeps them going. The stronger the community, the bigger potential audience you’ll find.

In that way, deciding where to sell your own work is just as much about deciding which community is the best fit as it is about profits. Fortunately, there are a lot of high-quality options for just about every designer!

]]>
The Benefits of Attending a WordCamp https://1stwebdesigner.com/the-benefits-of-attending-a-wordcamp/ Mon, 03 Jun 2019 13:07:54 +0000 https://1stwebdesigner.com/?p=148217 Of all the tools web designers use to make a living, WordPress stands out as unique. And it’s not necessarily because of the software itself (which is excellent, by the way).

No, what really separates WordPress from just about everything else out there is the amazing community built around it. It’s made up of an incredibly diverse group – web professionals, bloggers, business owners and educators (to name just a few). They hail from all over the world and pretty much every background you can imagine.

Among the crown jewels of this community are the many WordCamps held annually. These events have taken place in over 60 countries, spanning 6 continents (sorry, Antarctica – your time will come).

If you haven’t gotten around to attending an event, it’s definitely something to put on your bucket list. There are a number of benefits to doing so, including:

A Low-Cost Day Out

Everyone needs some time out of the office – even if it’s work-related (though WordCamps rarely feel like work). And you can’t get one much more affordable than a WordCamp. Prices are generally kept to around $20 USD per day! How many pro-level conferences can you attend for about the price of dinner at a pizza place?

Speaking of which, you won’t go hungry while you’re there. For that more-than-reasonable price, you’ll often get a meal (typically lunch), while snacks and beverages are also included. Plus, just walking in the door nets you a giveaway item, like a custom T-Shirt.

Prices are generally kept low due to the kindness of sponsors – both corporate and individual. As a bonus, they often attend the conference with their own collection of swag to give away.

Depending on the location of the camp, the largest expense for attendees tends to be travel (and, if necessary, a hotel). However, various organizations may provide grants to those in need of assistance, such as the Kim Parsell Memorial Scholarship.

A jar of pennies spilled on a table.

The Chance to Meet New People

Part of the WordPress community’s strength lies in its ability to attract people from all walks of life. Go to a WordCamp and you’re likely to run into experts and novices alike – not to mention everyone in-between those two skill levels.

And you can’t help but find yourself in at least a few good conversations. This is particularly true between sessions and at meal time, when attendees often congregate in a common area. Therefore, you’ll want to be prepared to answer the question, “How do you use WordPress?”

It’s also worth noting that the atmosphere is generally laid back. There is no corporate stiffness to be found and the dress code is pretty much come-as-you-are.

Overall, people are friendly and willing to chat. But even if you’re a bit shy – not to worry. You’ll find yourself in a place that lets you be you and move at your own pace.

A woman and man speaking at a desk.

Learning Opportunities

As much as anything, WordCamps are about learning. Many camps split their sessions into multiple “tracks”, each one aimed at a specific skill level or use type. For instance, you may find a track for hardcore developers along with others for visual designers, content creators or marketers.

It can be very worthwhile to attend sessions across a variety of tracks. Even if you don’t know a lot about a particular subject, you may be surprised at how much knowledge you can pick up. At the very least, you’ll have a better idea of, say, what React does or how the Gutenberg editor affects design choices.

Not only that, but you might also just discover a new favorite plugin or technique for getting things done. Everyone approaches building a WordPress website differently, and there is a chance to pick up some pointers from both speakers and attendees.

People sitting in a conference session.

Expand Your Reach

Of course, professionals primarily attend conferences to get their names out there, and a WordCamp provides a perfect opportunity to do so. And there are a number of ways to achieve your goal.

Volunteering to speak can be very effective, allowing you to show off your expertise in a particular WordPress-related area. If you’re comfortable giving presentations, this provides you with a room full of people who are eager to learn whatever knowledge you can share. Just know that you must apply to speak ahead of time, as there is often stiff competition for spots.

Even if you aren’t a featured speaker, there are still plenty of chances to network. As mentioned earlier, you’ll have opportunities to connect with other attendees, so make sure to bring lots of business cards! You never know when a casual conversation can lead to a new project.

People shaking hands across a desk.

A Worthwhile Experience

WordCamps provide a fun, affordable and potentially profitable experience. And, no matter your experience or skill level, there is an opportunity both meet new people and advance your career.

Sound interesting? To get started, watch a few of the top presentations from past events. Then, check out the upcoming schedule and register for an event in your neck of the woods.

]]>
9 Unique Free Fonts You (Probably) Haven’t Tried Yet https://1stwebdesigner.com/9-unique-free-fonts-you-probably-havent-tried-yet/ Thu, 30 May 2019 13:05:39 +0000 https://1stwebdesigner.com/?p=147927 As a web or graphic designer, you should always be on the lookout for an interesting new font to try. Typography is one of the most important elements of a design, and a unique font can really set your creation apart.

Decorative ones in particular can be rare due to the difficulty in making stylized text both beautiful and legible. Less common is these fonts being released for free, even on a personal license.

There’s also the trouble of the few free decorative fonts that are out there appearing in hundreds of thousands of creations, making it harder to create unique branding and excite people with a new, intriguing design.

But when simple serifs and sans serifs aren’t doing the trick, a unique font might be just the thing to liven up your design and give it some personality.

That’s why we’ve collected these nine interesting fonts here for you to try. These are newer or less popular, so your product will stand out more. Diversify your font repertoire with these beautifully designed typefaces!

UNLIMITED DOWNLOADS: 400,000+ Fonts & Design Assets




Ignite by James Lafuente

Example of Ignite by James Lafuente

Quantum by Greg “Seso” Ortiz

Example of Quantum by Greg "Seso" Ortiz

Blacker by zetafonts

Example of Blacker by zetafonts

Backyard by Mans Greback

Example of Backyard by Mans Greback

Pikolo Block Alt by ideabuk

Example of Pikolo Block Alt by ideabuk

The Rock Brush Font by MLKWSN

Example of The Rock Brush Font by MLKWSN

Shadow Stripes Vintage Typeface by Wahtung

Example of Shadow Stripes Vintage Typeface by Wahtung

Botera Stencil Font by Javi Montoya

Example of Botera Stencil Font by Javi Montoya

Gutenberg Font Family by Unio Creative Solutions

Example of Gutenberg Font Family by

Unique Stylized Fonts

Unique typography is one of the best ways to give a design some personality. With the right font, your work will be memorable and stand out from the crowd. Stylized fonts like these are less common, especially for free, because they’re harder to design. But when a well-made one appears, it’s sure to inspire many amazing creations.

Now it’s time to try some of these free fonts for yourself. Just remember to check the license if you’re using it commercially!

]]>
An Interview with One of the Best Selling WordPress Theme Authors https://1stwebdesigner.com/an-interview-with-one-of-the-best-selling-wordpress-theme-authors/ Tue, 28 May 2019 14:43:42 +0000 https://1stwebdesigner.com/?p=147979 We recently had the opportunity to interview Ivan Paunovic, the founder of Qode Interactive. Qode is the team behind Bridge, one of the best-selling WordPress themes.

Can you tell us a bit about how Qode started and the team behind it?

Qode started out as two people with a shared goal – to create quality digital products, but with a focus on beauty and aesthetics. In our early stages, we provided custom web development services. But we soon noticed the rising popularity of WordPress themes and saw an opportunity there, even though the marketplace was already fairly saturated.

Our team was still small, but we were all oriented toward UX and aesthetics. That was our main advantage. We made a decision back then that has become the cornerstone of our company: never to compromise our creative vision, even if it meant reaching fewer people. Instead of going down the commercial path and making the types of themes everyone was churning out, we primarily focused on great design. And I think that’s what distinguishes us from the rest of the market.

Qode Interactive home page

Your Bridge theme is one of the most popular WordPress themes on ThemeForest with over 100,000 sales — an incredible achievement. What do you believe sets Bridge apart from other WordPress themes?

When it came out, Bridge was just another theme by Qode. The thing is, we approach each new theme as a success, even in the earliest stages of design. I think that’s evident in all our themes, from the very beginning.

With Bridge, it turned out people were drawn to its clean and simple style, which was popular at the time. It got that initial boost straight out of the gate and gained enough visibility on the market. So, we adapted and started developing it in that direction. We wanted to offer Bridge to as many people as we could, while still sticking to our principles and making as few compromises as possible.

That’s how the Bridge demos came to be. Bridge currently has nearly 380 distinct demos, and we’re always adding more. It was the first bestseller on the market with so many and might have even set the standard in terms of the number and the quality of demos a WordPress theme can have.

Bridge WordPress Theme

With the huge success of Bridge and your other WordPress products, what are some challenges you’ve faced with that type of growth?

Bridge served as proof that we were doing something right and it motivated us to keep moving in that direction. So when we decided to create new brands and expand our catalog of themes, we knew we would need a lot more manpower. Our first goal was hiring the best people in the business.

We now have over 100 employees, and more than 25 professional designers and artists working on our themes. With so many people cooperating on multiple projects, we had to implement a set of procedures to make sure things run smoothly at all times.

We also quickly outgrew the downtown apartment we started from and had to move to a larger office. This alone brought its own set of challenges: planning the space, remodeling, obtaining all the necessary equipment, etc. A larger company requires a completely different approach than a startup. But with great success comes great responsibility, I guess.

Qode Interactive theme catalog

What has your experience been like developing for Gutenberg and are you excited for the direction WordPress is taking?

We’re currently working on a new theme framework that’s ultimately going to let users switch between page builders. Developing for Gutenberg has been a significant part of that project.

We definitely see Gutenberg as a step in the right direction. The components and modules are well executed, but the editor in its current form isn’t as user-friendly as we’d like it to be. We think there’s still work to be done in terms of the UX.

Of course, we understand this is just the first phase of what could be an entirely new approach to website building in WordPress and we’re excited to see where it goes. But one of the goals with our new framework is to give users a choice in terms of the editor they’d like to use.

If you could give any advice to a new designer or developer trying to sell digital goods, what would it be?

Everyone that came before you already has a massive head start. So, when thinking about the audience for your product, don’t take the expected route. Don’t try to satisfy everyone at all times. That’s a surefire recipe for failure.

Find a small but reliable audience and do everything you can to speak directly to their needs. Tailor all aspects of your business – from your actual product and its functionalities to your design, branding, and messaging – to that select group of people and you’ll have a way better chance at success.

Do you have any tips on promoting your work to build an audience?

The best form of promotion is the quality of your product. And satisfied customers are always the best advocates. I think ThemeForest does a good job of promoting great themes, but these days, with so many authors and themes out there, you can’t rely only on that. You need to use all available techniques to get your themes in front of your target audience. Once you accomplish that, the design and quality will often be the deciding factors.

When it comes to places for promoting our work, we take a special interest in visually-oriented social networks. Particularly ones like Dribbble and Pinterest, where we can connect with fellow designers and other users who recognize the importance of a visual experience.

Qode Interactive Dribble profile

Before we wrap up this interview, are there any upcoming products or other announcements you’d like to share?

We recently launched the new Qode Interactive website. It’s now the home of all 330+ themes from our five brands. If you look at the current state of the market, you’ll see that the best quality often gets buried in the avalanche of themes coming out every day. Our new site provides a collection of themes that make no compromise when it comes to quality.

And finding the right one is now quicker and easier than ever, thanks to our powerful filtering system. We made sure people can search themes based on all imaginable parameters, from colors, styles, and effects all the way down to the shortcodes and plugins each theme comes with. So, if you’re looking for a new way to find beautiful WordPress themes, you might want to check it out.

Qode Interactive theme search and filtering

]]>