15+ Best Icon Fonts for Web & UI Design (Free + Premium)

Icon fonts are one of the most useful elements that web and UI designers simply can’t live without. Today we’re bringing you a collection of the best modern and creative icon fonts you can use in your website and user interface designs. With icon fonts, you don’t have to rely on libraries of PNG files. You don’t have to resize and edit icons using vector files to make them fit into your website designs. And, more importantly, you don’t have to worry about optimizing the icons for various screen sizes. However, finding the right icon font to blend with your design projects can be challenging. We want to make that process much easier. Get started by browsing our handpicked collection of free and premium icon fonts (and be sure to take a look at our tips for choosing an icon font to help you get started!) Icofont – Free Creative Read the full article…

Become An HTML Email Geek With These Videos From Rémi Parmentier

Become An HTML Email Geek With These Videos From Rémi Parmentier Become An HTML Email Geek With These Videos From Rémi Parmentier Rachel Andrew 2019-11-14T12:00:00+00:002019-11-15T11:08:36+00:00 Creating an HTML email can feel like stepping back a few years as a web developer. All of our new layout functionality is unavailable to us &mdasj; email clients render the same layout in completely different ways. Just when we think we have it all fixed, another email client shows up with a new set of bugs. Not too long ago, Rémi Parmentier, an HTML Email developer, ran a session with practical front-end techniques for building modern, cross-client emails. A few weeks later, he gave a wonderful talk at SmashingConf Freiburg highlighting some of the common struggles and shared useful strategies for avoiding problems in email development. There was so much useful information contained in these sessions that we wanted to release them more widely Read the full article…

Better Design With Deep Thinking

Better Design With Deep Thinking Better Design With Deep Thinking Eric Olive 2019-11-13T11:00:00+00:002019-11-14T11:05:41+00:00 Interruptions, administrative tasks, and too many meetings are among the common complaints voiced by today’s professionals. When was the last time someone complained about a canceled meeting? In other words, everyone understands what hinders productivity, right? Not so fast, says computer scientist Cal Newport. While we all realize that interruptions and fragmented time are troublesome, we fail to recognize: The frequency of interruptions: We convince ourselves that we are focusing on one task at a time, such as a complex interaction design problem. Yet, every ten minutes or so, we check email or answer a text. Yes, we’re performing one task at a time, but the duration of that task is brief. The cost of these interruptions: As Newport explains on a recent episode of Hidden Brain: “Even those very brief checks that switch your context even Read the full article…

What Is Adobe XD? a 101 Intro

Adobe’s UX design tool seems to be picking up speed. Have you tried Adobe XD yet? The tool is part of the design giant’s suite of software. It meets a need that was being filled by other tools such as Sketch and Figma. But thanks to Adobe’s large customer base, XD is proving itself a viable option. Here, we’ll look at what Adobe XD is – and isn’t – to help you figure out if this tool might be worth exploring. Whether you’re already sold on Adobe XD and want to learn more, or you’re weighing it up against the pros and cons of other tools, we’ll give you a helpful introduction to make the decision easy. What Is Adobe XD? Adobe XD is a vector-based digital design tool for websites and apps. Use it to create and collaborate on everything from prototypes to mockups to full designs. Here’s how Read the full article…

Adapting Agile For Part-Time Teams

Adapting Agile For Part-Time Teams Adapting Agile For Part-Time Teams Philip Kiely 2019-11-12T12:00:00+00:002019-11-13T11:06:28+00:00 The formal notion of the Agile software development method is about as old as I am (the Agile Manifesto was published in February 2001). I point this out not to make you feel old, but instead to demonstrate that Agile has had a long time to infiltrate software development. While the methodology advocates for “co-located, dedicated teams,” in its ubiquity Agile is frequently applied to teams partially or fully composed of part-time workers. While there are lessons to be taken from the practice, Agile must be adapted to support, rather than hinder, part-time teams. In this article, we’ll consider applying Agile to a team of 5-10 people each working 20 hours per week on a project. We’ll further consider the frequent intersection of remote work with part-time teams and discuss situations where contributors work as few as Read the full article…

20+ Website Wireframe Templates (For Sketch, Photoshop + More)

Making a complete website wireframe is supposed to be a simple task. But, starting from scratch without a template or quick-start guide can be a nightmare. It takes significant work to make wireframe look beautiful, as well as being optimised for functionality. Especially when you have to create a wireframe to get a client’s approval, or to showcase to a team. Thankfully, you can use wireframe templates to create more professional wireframes without having to hand-craft everything. These templates include pre-made layouts along with all the elements that go with it. All you have to do is customise and rearrange the components to make your own wireframe design. They’re a huge time-saver, and can help you get started fast. We’ve hand picked some great website wireframe templates just for you. Have a look. WireFire – 300+ Website Wireframe Kit for Sketch WireFire is a massive website wireframing kit for Sketch Read the full article…

SmashingConf New York 2019: Videos And Photos

SmashingConf New York 2019: Videos And Photos SmashingConf New York 2019: Videos And Photos Rachel Andrew 2019-11-12T10:00:00+00:002019-11-12T11:12:17+00:00 We love running our event in New York, and given that it sold out a long way in advance we think that you do too. If you didn’t manage to get a ticket, this post should give you a feel for what happened. We also have the video of the presentations to share with you. Enjoy this roundup, and if you want to be there in person for one of our events next year, tickets are on sale right now! Topple the Cat greeted attendees by way of our Broadway posters (Photo credit: Drew McLellan) The Presentations Day 1 Day 2 Workshops Side Activities Morning Run Evening Events The Presentations The main focus of the conference is the speakers and the presentations they bring. As with all of our 2019 events, some speakers Read the full article…

What Newspapers Can Teach Us About Web Design

What Newspapers Can Teach Us About Web Design What Newspapers Can Teach Us About Web Design Frederick O’Brien 2019-11-08T11:30:00+00:002019-11-09T11:06:56+00:00 It’s easy to get caught up in the latest trends in web design. Web technology is constantly improving, and today developers have a formidable range of features at their disposal. This makes for a forward-thinking, innovative space — as it should — but also one at risk of being unrooted. Every art has its ancient masters. In the case of websites, it’s newspapers. When you dig into the basic principles of news design, overlaps with the web are frequent and oftentimes indistinguishable. Many web design best practices can be traced directly back to news design. When it comes down to it, websites are made for users to engage with, and hopefully return to. Newspapers have been playing that game for centuries, and winning. Anyone with even a passing interest in web Read the full article…

20+ Best Chunky Fonts

Chunky and chubby fonts are a great choice for designing fun and creative titles for all kinds of designs. In this post, we bring you a selection of the best chunky fonts with many different styles. Due to their unique style of design, chunky fonts are most suitable for creative, fun, and entertaining designs. Our list of chunky fonts includes different types of fonts for designing everything from posters to greeting cards and much more. Start exploring the list to find the right chunky font for your next project, and be sure to read through our tips for choosing (and using) chunky fonts for some handy design advice! Top Pick BoldenVan – Creative Chunky Font This chubby font features the perfect combination of fun and creativity to instantly grab anyone’s attention. The BoldenVan font features a bold design with chunky characters that’s simply ideal for children’s designs such as posters Read the full article…

Meet “Inclusive Components”, A New Printed Book By Heydon Pickering

Meet “Inclusive Components”, A New Printed Book By Heydon Pickering Meet “Inclusive Components”, A New Printed Book By Heydon Pickering Vitaly Friedman 2019-11-07T12:30:00+00:002019-11-08T11:07:45+00:00 The web is full of interfaces that leave people out. Of course, it’s not designers’ malicious intent or developers’ lack of empathy that bring us there. It’s just really difficult to foresee a wide range of situations in which our users might find themselves in. We need to build robust and reliable solutions in a world that’s inherently chaotic and unpredictable. Where do we even start? Because we often build and deploy under tough deadlines, we tend to break accessibility without even noticing it. Our products become slower, clunkier and more painful to use — often simply unbearable for keyboard- and screen reader users, and as such fragile and vulnerable for legal disputes. Let’s fix it. Meet Inclusive Components, our new handbook for building fully accessible websites Read the full article…

Inclusive Design And Accessibility: Live Stream With Heydon Pickering

Inclusive Design And Accessibility: Live Stream With Heydon Pickering Inclusive Design And Accessibility: Live Stream With Heydon Pickering Vitaly Friedman 2019-11-07T13:45:59+02:002019-11-08T11:07:45+00:00 Accessibility can sometimes become an unfortunate afterthought as we race to meet deadlines and search for tips and tricks to meet client demands. We can cause problems for keyboard or screenreader users, and leave our products fragile and potentially vulnerable to legal action from people who find themselves locked out due to their accessibility needs. How can we get better? One way to find out would be by joining our live stream with Heydon Pickering who will be sharing insights about the relationship between accessibility and design systems, and exploring how to build accessible components, and why he decided to write a book on accessible interface design patterns. Live Stream On Inclusive Design: Nov 7, 5:00 PM GMT The session will start today, November 7, at 6:00 PM Berlin Read the full article…

Examples of Great Fall Email Newsletters with Tips and Tricks

You’re reading Examples of Great Fall Email Newsletters with Tips and Tricks, originally posted on Designmodo. If you’ve enjoyed this post, be sure to follow on Twitter, Facebook! Fall is ideal for email marketing campaigns. It is that time of the year to enjoy quality time at home with a cup of warm tea and delicious biscuits while surfing the web. It is a perfect opportunity to catch … Read the full article…

React and CI/CD – From 0 to Released

You’re reading React and CI/CD – From 0 to Released, originally posted on Designmodo. If you’ve enjoyed this post, be sure to follow on Twitter, Facebook! CI/CD has become the beating heart of any software team. A well-refined CI/CD process results in a frictionless path to live. In turn, this results in smaller, simpler releases that enable teams to test out experiments, react to bugs and … Read the full article…

How + Why to Use a Website Wireframe Template

Wireframing is one of those design processes that happens organically and intentionally. How many times have you sketched an idea during a meeting? How many times have you created a presentable wireframe for a client meeting? Both types of wireframes are equally important parts of the design and iteration process. The latter takes a little more effort to create, and that’s where a wireframe template comes in. Here’s everything you need to know about using them effectively, and how they can help to save you time, improve the quality of your wireframes, and help you get your ideas down in a physical format. What is a Website Wireframe Template? A wireframe is a basic illustration of a website design concept. Each page type may have its own wireframe. These designs often start in the form of sketches and can eventually evolve into mockups or prototypes. A website wireframe template is Read the full article…

Exploring New Ways To Manage Content In WordPress

Exploring New Ways To Manage Content In WordPress Exploring New Ways To Manage Content In WordPress Leonardo Losoviz 2019-11-07T11:30:59+02:002019-11-07T11:12:03+00:00 The combination of WordPress’ versatility for managing data (since its database model supports the creation of different content models, easily extensible through meta attributes) and Gutenberg’s rich user interactions provide a powerful mechanism to create, edit and manage content. In this article, I want to shine some light on these upgraded capabilities, exploring the new tools at our disposition and presenting several new ones to be released sometime in the future. Existing Features The following features are already part of Gutenberg-powered WordPress. Create Once, Publish Everywhere As I have described in my recent article “Create Once, Publish Everywhere” with WordPress, the block-based nature of Gutenberg enables it to enhance how content is organized/architected on the database, making it available on a granular basis (block by block) to any application running on Read the full article…

Writing A Multiplayer Text Adventure Engine In Node.js: Adding Chat Into Our Game (Part 4)

Writing A Multiplayer Text Adventure Engine In Node.js: Adding Chat Into Our Game (Part 4) Writing A Multiplayer Text Adventure Engine In Node.js: Adding Chat Into Our Game (Part 4) Fernando Doglio 2019-11-06T11:00:00+02:002019-11-06T11:06:58+00:00 Any platform that allows for collaborative play between people will be required to have one very particular characteristic: the ability for players to (somehow) talk to each other. That is exactly why our text-adventure engine built in Node.js would not be complete without a way for the party members to be able to communicate with each other. And because this is indeed a text adventure, that form of communication will be presented in the form of a chat window. So in this article, I’m going to explain how I added chat support for the text client as well as how I designed a quick chat server using Node.js. Previous Parts Of This Series Part 1: The Introduction Read the full article…

Smashing Podcast Episode 2 With Liz Elcoate: What’s So Great About Freelancing?

Smashing Podcast Episode 2 With Liz Elcoate: What’s So Great About Freelancing? Smashing Podcast Episode 2 With Liz Elcoate: What’s So Great About Freelancing? Drew McLellan 2019-11-05T16:00:59+02:002019-11-06T11:06:58+00:00 In this episode of the Smashing Podcast we take a look a freelancing. What does it mean to be a freelance designer or developer? How do you structure your day? What are the ups and downs? Drew McLellan talks to experienced freelance brand designer Liz Elcoate to find out more. Show Notes Making Peace With The Feast Or Famine Of Freelancing on Smashing Magazine. Liz is the host of The Elastic Brand podcast, and cohost of The Freelance Web with Sean Johnson. You can follow Liz on Twitter where she is @liz_e or via her website. Transcript Drew: She’s a UK based designer who specializes in building digital brands. She’s worked on campaigns with the likes of Great Ormond Street Hospital, the NSPCC, Read the full article…

Smashing Podcast Episode 1 With Andy Clarke: What Is Art Direction?

Smashing Podcast Episode 1 With Andy Clarke: What Is Art Direction? Smashing Podcast Episode 1 With Andy Clarke: What Is Art Direction? Drew McLellan 2019-11-05T14:30:59+02:002019-11-06T11:06:58+00:00 The new Smashing Podcast is the perfect way to take a little bit of Smashing along with you on your morning commute, when working out at the gym, or just washing the dishes. We’ll be bringing you a new interview with a Smashing expert every two weeks, directly to your podcast player of choice. You can subscribe in your favorite app to get new episodes as soon as they’re ready, or just listen using the player below. To get things off with a bang, we’re launching the first two episodes today. Each episode will be accompanied by a post (just like this one) with a full transcription of the interview here on Smashing Magazine. In this inaugural episode, Drew McLellan talks to designer, author, and Read the full article…

20+ Best Adobe XD UI Kits + Templates 2019

Today we’re bringing you a collection of some of the best Adobe XD UI kits and templates. With these templates, you can create more professional-looking designs using Adobe’s stellar UX design tool. Adobe XD took everyone by surprise when it was released with a free plan. It wowed many user experience and user interface designers as it served as a great Sketch app alternative. Something that was much needed by the Windows users. Adobe XD app itself has many features that make it a great tool for UX designers. However, with third-party templates, you can create so much more amazing designs. All the Adobe XD UI kits and templates in our list are proof of that. We’re also sharing a few tips for using a UI kit in Adobe XD to get you off to a quick start. Top Pick Think Mobile UI Kit – 120 Screen Templates This is Read the full article…

Designers, Get Your Custom Domain at Hover

Looking for a way to make your design portfolio – or any other website, for that matter – stand out? A custom, top-level domain is the start. Hover is a leading provider of domains and mailbox services for you or your small business. You can snag a new domain or transfer an existing one to their platform. Not sure how to get started? Here’s everything you need to know about Hover and the services and tools they provide for individuals and businesses. What is Hover? Simply, Hover is a domain registrar. The Canadian-based company has been around for more than a decade and serves customers all over the world. (It’s actually the second-largest domain registrar in the world.) The company is dedicated to privacy Hover has built a company on the belief that buying a domain name should be a quick, intuitive, and honest process. Rather than a complex process, Read the full article…