Monday, October 13

Web Tricks

Making Distributed Product Teams Work More Efficiently With monday.com
Web Tricks

Making Distributed Product Teams Work More Efficiently With monday.com

Making Distributed Product Teams Work More Efficiently With monday.comMaking Distributed Product Teams Work More Efficiently With monday.com Nick Babich 2018-08-23T14:00:26+02:00 2018-08-23T12:23:54+00:00 (This is a sponsored article.) The way that product teams work is changing: The software industry is quickly moving to remote work. In the US alone, 43% of employed Americans have spent at least some time working remotely, and that number has steadily increased in recent years. Many successful digital products on the market today were designed and developed by a distributed team. Such teams don’t have an office in the traditional sense. Everyone chooses to wor...
Web Tricks

Designing The Invisible: 3 Things I Learned Designing For Voice

Designing The Invisible: 3 Things I Learned Designing For VoiceDesigning The Invisible: 3 Things I Learned Designing For Voice William Merrill 2018-08-22T14:00:44+02:00 2018-08-22T12:45:32+00:00 The current iteration of voice-controlled digital assistants are still struggling to integrate as seamlessly as the big three voice players of Amazon, Google and Apple would hope. A 2017 report by Voicelabs states there’s only a 3 percent chance a user will be active in the second week after downloading a voice application and 62 percent of Alexa’s skills are still to get any kind of rating on its store (as of September 2017). As designers, we have a real opportunity t...
5 Ways to Boost Local SEO
Web Tricks

5 Ways to Boost Local SEO

Let’s not beat around the bush, local SEO is hard. If you represent a business in a large city and you’re aiming for a top 3 maps business listing (the Snack Pack), then it’s even harder. You can spend many stressful hours tailoring every little aspect of your site, trying to achieve this and lose sanity along the way wondering where you’ve gone wrong. It can be a very lonely place. An important thing to do to retain your sanity is to be realistic and confront a few honest truths. no one knows with full certainty…who will make it into the coveted snack pack One of those truths is that no one knows with full certainty, how, or who will make it into the coveted snack pack for any given search query. Not the best SEO specialists, not the people working at Google—I’m not even convinced Google...
Web Tricks

Testing Angular with Jasmine and Karma (Part 1)

Our goal In this tutorial we will be building and testing an employee directory for a fictional company. This directory will have a view to show all of our users along with another view to serve as a profile page for individual users. Within this part of the tutorial we'll focus on building the service and its tests that will be used for these users. In following tutorials, we'll populate the user profile page with an image of the user's favorite Pokemon using the Pokeapi and learn how to test services that make HTTP requests. What you should know The primary focus for this tutorial is testing so my assumption is that you're comfortable working with TypeScript and Angular applications. As a result of this I won't be taking the time to explain what a service is and how it's used. Instead, ...
Onboarding Users Of Your Product: From Trial To Payment
Web Tricks

Onboarding Users Of Your Product: From Trial To Payment

Onboarding Users Of Your Product: From Trial To PaymentOnboarding Users Of Your Product: From Trial To Payment Joe Leech 2018-08-21T14:20:21+02:00 2018-08-21T13:33:03+00:00 (This is a sponsored article.) In part one of this series, we looked at the Attraction phase of the customer lifecycle. This three-part series outlines the three phases of the product lifecycle, the future for UX, and the skills and approach you’ll need to design modern digital products. Part 1: AttractionGoing out there to get users to evaluate your product. Part 2: ActivationSigning up, onboarding users, asking for payment. Part 3: RetentionEncouraging users to come back and keep using an...
Introducing Crello Animation Maker
Web Tricks

Introducing Crello Animation Maker

Crello is an innovative design tool from Depositphotos that’s simple to pick up and use, and outputs high-quality results. In an increasingly saturated design tool market, it could be the best tool you’ve never tried. Now, after the popularity of Crello, Depositphotos are releasing Crello Animation Maker. A brand new set of features that enable anyone to convert design assets into engaging animation for the web, in just a few clicks. Introducing Crello Animation Maker Crello Animation Maker is designed to enable anyone to quickly and easily convert Crello designs into animated assets for use on social media, or in adverts. It’s an incredible tool for marketing teams, who can take existing designs and create new campaigns in minutes, without having to pull the design team away from other ...
Web Tricks

Build a Reusable Component with Angular Elements

Code reuse can be significant in any software project. By reusing code, developers can drastically cut development and maintenance time for software projects. This is the reason that every framework for developing software has a way to encapsulate functionality and reuse it. Whether it's classes in C# and Java or modules in JavaScript, it's a safe bet that you've considered extracting some piece of functionality to reuse it somewhere else. The only place that has never had a good story for reusing code is in HTML. Until now. Projects like Stencil from the Ionic team, SkateJS, and now Angular Elements are making it easier than ever for developers to create components in the frameworks that they love and export them as Web Components so that they can use them in projects that may or may not ...
Web Tricks

Building CLI Applications with NodeJS

As a developer, chances are you spend most of your time in your terminal, typing in commands to help you get around some tasks. Some of these commands come built into your Operating System, while some of them you install through some third party helper such as npm, or brew, or even downloading a binary and adding it to your $PATH. A good example of commonly used applications include npm, eslint, typescript, and project generators, such as Angular CLI, Vue CLI or Create React App. Shebang This is the wikipedia definition: In computing, a shebang is the character sequence consisting of the characters number sign and exclamation mark (#!) at the beginning of a script. Whenever you look at any scripting file, you'll see characters such as the ones below in the beginning of the file. #!/usr/...
Web Tricks

UX And HTML5: Let’s Help Users Fill In Your Mobile Form (Part 1)

UX And HTML5: Let’s Help Users Fill In Your Mobile Form (Part 1)UX And HTML5: Let’s Help Users Fill In Your Mobile Form (Part 1) Stéphanie Walter 2018-08-20T13:45:31+02:00 2018-08-20T11:56:00+00:00 Forms are one of the most basic primary interactions users will have with your websites (and mobile apps). They link people together and let them communicate. They let them comment on articles and explain to the author how they strongly disagree with what they’ve written. They let people chat directly on a dating app to meet “the one”. Whether for forums, product orders, online communities, account creation or online payment, forms are a big part of users’ online lif...
20 Freshest Web Designs, August 2018
Web Tricks

20 Freshest Web Designs, August 2018

Welcome to our roundup of the best websites launched (or relaunched with significant updates) this August. The Summer’s almost over, vacations are less frequent, and we’re starting to see businesses gearing up for the Fall. This month we’ve included some great e-commerce, some design agencies with a difference, and some products with marketing challenges. There’s a huge trend for bold color, subtle animations, and scrolling effects this month. And not before time, big type is making a comeback. Enjoy! Epicurrence The creative conference for creatives that don’t do conferences, Epicurrence 2018 takes place in Yosemite later this month. The accompanying site uses stunning illustrations and subtle parallax to draw the user into the spirit of the event. Angelo Sanvito Angelo Sanvito is an il...
Popular Design News of the Week: August 13, 2018 – August 19, 2018
Web Tricks

Popular Design News of the Week: August 13, 2018 – August 19, 2018

Every week users submit a lot of interesting stuff on our sister site Webdesigner News, highlighting great content from around the web that can be of interest to web designers.  The best way to keep track of all the great stories and news being posted is simply to check out the Webdesigner News site, however, in case you missed some here’s a quick and useful compilation of the most popular designer news that we curated from the past week. Note that this is only a very small selection of the links that were posted, so don’t miss out and subscribe to our newsletter and follow the site daily for all the news. Scroll Bouncing on your Websites   Site Design: Kommigraphics   How Ikea Quietly Tweaks its Design Around the World   Screenlife App – A UI/UX Case Study   Reviewed: New Logo and Id...
Designing For Micro-Moments
Web Tricks

Designing For Micro-Moments

Designing For Micro-MomentsDesigning For Micro-Moments Suzanna Scacca 2018-08-17T13:50:09+02:00 2018-08-17T11:59:10+00:00 A couple of years ago, Google announced a new mobile-first initiative it wanted web designers and marketers to pick up on. This was our introduction to micro-moments. These are not to be confused with micro-interactions, which are miniscule engagements websites have with visitors when they "touch" key points of the interface. A mouse changes its appearance when a user hovers over a clickable element. A display error appears after a field is incorrectly populated. A checkbox briefly enlarges and changes color after it’s been ticked off. Thes...
The Real Problem With Pre-Made Themes
Web Tricks

The Real Problem With Pre-Made Themes

Designers, developers, site owners… lend me your eyeballs for a bit. There’s something rotten in the state of pre-made website themes. Alright, I’ve offended The Bard quite enough. But you get my point, right? Themes have gotten a bad rap for a variety of reasons: they can have bloated code, content must be designed to fit in them rather than designing them to fit the content, et cetera. But they’ve also gotten really good. Many are made to be modular, so you only use and load the code you need. People have gotten a lot better at coding things to load fast, and there’s a theme for nearly every conceivable need. So maybe it’s not as optimized as it could be, if you’re not getting Amazon levels of traffic, regular hosting should be fine, right? And again, there’s a theme for every conceivab...
Monthly Web Development Update 8/2018: The Cost Of JavaScript, Ethics In Open Source, And QUIC
Web Tricks

Monthly Web Development Update 8/2018: The Cost Of JavaScript, Ethics In Open Source, And QUIC

Monthly Web Development Update 8/2018: The Cost Of JavaScript, Ethics In Open Source, And QUICMonthly Web Development Update 8/2018: The Cost Of JavaScript, Ethics In Open Source, And QUIC Anselm Hannemann 2018-08-17T11:57:10+02:00 2018-08-17T11:59:10+00:00 Building technology and software has become a very responsible job. People trust the products we create, and they can have a significant impact on their lives, too. Considering this, we not only need to think about inclusive solutions, but also stand up and advocate for ethics, reliability, and security. It’s a position that gives us power. Eric Meyer published an article elaborating the problems which an H...
Web Tricks

Debugging Angular CLI Applications in Visual Studio Code

Debugging Angular CLI Applications in Visual Studio Code In this post, we are going to create an Angular CLI application, then add configuration to debug it in Visual Studio Code. Watch on YouTube TLDR - For an Angular CLI application, create a debug configuration in VS Code, install the Debugger for Chrome extension, then run in debug mode. Debugging Angular CLI Applications in Visual Studio Code Creating a Starter Project Creating Debug Configuration Let's Debug Learn VS Code If you're interested in learning more about VS Code, you definitely want to check out the upcoming Learn VS Code course. Creating a Starter Project To be able to test an Angular CLI application, you need an Angular CLI application :) I'll provide the basic steps, but for more reference on how to get start...