Web Design

23
Oct

10 Simple Code Snippets for Creating Beautiful Tabs

Posted by | No Tags | Web Design

Tabs are a fundamental part of the web, and they’ve been around for years, but with even more developers going open source there’s a whole world of free code snippets out there. If you’re building a tabbed widget you could always start from scratch, or you could rework someone else’s code and style the element to fit your project. That’s why I collected this collection of the best tabbed widget snippets. Each is unique, easy to work with, and offers bountiful code you can copy & edit into your own […]

Read More
22
Oct

Weekly News for Designers № 408

Posted by | No Tags | Web Design

This is our popular weekly design news post where we share our favorite design related articles, resources and freebies from the past week. You can sign-up to our awesome weekly newsletter or follow us on Twitter for some more amazing design articles, resources and freebies. New Resources & Tools One-Nexus – A front-end boilerplate and UI toolkit built using the Synergy framework, combined with a custom grid system; Kayzen-GS. fontplop – An OSX/macOS application which takes ttf and otf files and outputs a webfont bundle. Get FullStory for Free, Forever. […]

Read More
20
Oct

The Keys to Becoming a Self-Reliant Freelancer

Posted by | No Tags | Web Design

Many people choose a freelance career because of the freedom it affords. But that freedom also comes with the reality that pretty much every business-related task falls to just one person: You. That isn’t always at the front of our minds when we decide to take our lives in this new direction. The truth is, success in this career path is tied to how well we manage our business as a whole. Beyond just the fun creative stuff, that includes all the money management grunt work and thankless administrative tasks […]

Read More
18
Oct

10 CSS & JavaScript Parallax Scrolling Code Snippets

Posted by | No Tags | Web Design

There’s a lot of confusion about parallax design and how it works on the web. Generally speaking, parallax design is the use of motion to create the illusion of depth on a page. This can relate to background changes or semi-fixed position items that move alongside the user’s scrolling. We’ve covered many examples from websites but haven’t gone into detail about the techniques involved. For this collection I’ve picked my favorite parallax designs that offer free source code you can play around with and even bring into your own projects. […]

Read More
18
Oct

Convincing Clients to Invest in a Custom Website

Posted by | No Tags | Web Design

The web design marketplace has never been more flooded with choices for consumers. Whether we’re competing with other talented designers or DIY services that promise the moon (all for one low monthly price), sometimes it takes a little something extra to help prospective clients better understand what you have to offer. Here are some tips for making your case: Explain the Differences If you offer custom design and development, it’s getting more difficult to compete on the basis of price. With popular services like Wix or Squarespace offering business owners […]

Read More
17
Oct

10 Snippets for Creating Unique CSS Background Effects

Posted by | No Tags | Web Design

In modern web design backgrounds are big (both literally and figuratively). With the advent of HD (and now 4K) displays, designers are creating backgrounds that take up loads of screen real estate. Why? Because they make for an incredible visual impact and help to tell a story. But there is so much more to backgrounds than simply throwing a photo or texture into a large space. A combination of CSS and the occasional bit of JavaScript power the creation of some amazing special effects. Let’s explore some of the unique […]

Read More
02
Oct

UX at Scale 2017: Free Online Conference with 20,000+ Registrants

Posted by | No Tags | Web Design

Scaling design is one of the greatest challenges faced by product teams today. That’s because design just doesn’t scale like engineering. As teams, products, and processes grow, things eventually break. Despite how daunting the challenge seems, plenty of companies have adapted their own best practices over the years. Now they’re going to share their stories with the world. On Oct 3-6, UXPin is hosting its third virtual event: UX at Scale 2017. Learn from 15 UX leaders at Atlassian, Salesforce, Airbnb, GE Digital, IDEO, Google, ADP, Linkedin, Shopify, Autodesk, Forumone, […]

Read More
01
Oct

Weekly News for Designers № 405

Posted by | No Tags | Web Design

This is our popular weekly design news post where we share our favorite design related articles, resources and freebies from the past week. You can sign-up to our awesome weekly newsletter or follow us on Twitter for some more amazing design articles, resources and freebies. New Resources & Tools Micromodal.js – A lightweight, configurable and a11y-enabled modal library written in pure JavaScript. Modern JavaScript Cheatsheet – A cheatsheet for the JavaScript knowledge you will frequently encounter in modern projects. Cato – A browser extension that allows you to control your […]

Read More
29
Sep

The Atlassian Design System: Creating Design Harmony at Scale

Posted by | No Tags | Web Design

When Atlassian expanded their focus on design in 2012, Jürgen Spangl was hired as the new Head of Design. One of the first projects he initiated was creating the Atlassian Design Guidelines (ADG) – their new internal design system. At the time, they faced several challenges common to scaling a design practice: Design inconsistency – For example, 45 different types of dropdowns. Insufficient tooling – The team needed more powerful design tools to scale their work across multiple products. Redundant questions – Atlassian designers wanted to spend more time on […]

Read More
29
Sep

10 Super Useful Code Generators for Web Designers

Posted by | No Tags | Web Design

Code generators can be a web designer’s best friend for a couple of reasons. For one, they can often help you learn new techniques or brush up on ones you may have missed out on. Second, they make quick work out of an otherwise repetitive process. We’ve scoured the web in search of code generators that cover a variety of languages and niches. Here are 10 of our favorites: Flexy Boxes Working with CSS Flexbox can be…difficult (and confusing). Thus, there are more than a few generator tools out there. […]

Read More