Menu Search
Jump to the content X X
Smashing Conf Barcelona

You know, we use ad-blockers as well. We gotta keep those servers running though. Did you know that we publish useful books and run friendly conferences — crafted for pros like yourself? E.g. our upcoming SmashingConf Barcelona, dedicated to smart front-end techniques and design patterns.

How To Develop A Chat Bot With Node.js

In the past few months, chat bots have become very popular, thanks to Slack, Telegram and Facebook Messenger. But the chat bot idea is not new at all.

How To Develop A Chat Bot With Node.js

A chat bot interface is mentioned in the famous Turing test in 1950. Then there was Eliza in 1966, a simulation of a Rogerian psychotherapist and an early example of primitive natural language processing. After that came Parry in 1972, a simulation of a person with paranoid schizophrenia (and, yes, of course, Parry met Eliza).

Read more...

Taking The Pattern Library To The Next Level

No thorough conversation about the front end today can end without mention of pattern libraries. Sometimes a pattern library appears in the form of a living style guide, or as a design system, or as the outcome of an atomic design process, or as an all-knowing user interface framework. In all of these cases, designers and developers seek the right strategy to approach the complexity of the web with a modular, components-based approach.

Sketching out the modules and patterns within the interface.

However, finding the right way to architect a lasting pattern library and to integrate it into an existing workflow seems to be a challenging task and one that most design and development teams eventually give up on. In this article, I’d love to highlight some practical techniques and strategies to establish a lasting pattern library that will be actively and consistently used by the entire team. These tips might help you get on the right track when you set out to build your next style guide, assets library or design language.

Read more...

Advertise with us!

What’s The Deal With The Samsung Internet Browser? An Interview With Jungkee Song

According to browser statistics, Chrome for Android is currently the largest mobile browser, or is about to become so. Still, too few web developers realize that these Chrome for Android numbers in fact contain several browsers, not just Google Chrome. After discussing the general state of affairs in this article, we’ll focus on the Chromium-based Samsung browser specifically.

Samsung Internet Browser – What’s The Deal? Smashing Magazine

In the past few years, just about all Android device vendors have upgraded their default browsers to Chromium… but not to Google Chrome. Instead, they took an older Chromium version of their choice, modified it somewhat, and added it to their devices as "Internet" or "Browser."

Read more...

Designing Card-Based User Interfaces

Web and mobile apps are moving away from pages towards completely personalized experiences. These new experiences are built on an aggregation of many individual pieces of content. The way this content is now being presented is in the form of cards. The card-based interaction model is spreading pretty widely, and you can see digital cards almost everywhere — from news sites to food delivery apps.

Designing Card-Based User Interfaces

In this article, I'll explain what cards mean to UI designers, and I'll review three popular card-based services. If you're interested in prototyping your own card-based user interface, you can download and test Adobe's Experience Design CC for free and get started right away.

Read more...

In-App Gestures And Mobile App User Experience

Remember the days when hovering and clicking using the mouse were the most used trigger for interaction with site or app? Those days are gone. When Apple introduced the iPhone, multi-touch technology became mainstream and users learned that they could not only point and tap on the interface, but also pinch, spread, and swipe. Gestures are the new clicks.

In-App Gestures And Mobile App User Experience

The rise of touch and gesture-driven devices has dramatically changed the way we think about interaction. Gestures are more than merely entertaining, they are very useful and feel familiar. Today, the success of a mobile app significantly depends on how well gestures are implemented into the user experience. Even Adobe introduced a new design and wireframing app called Experience Design CC (Adobe XD) that lets you prototype on everything from simple wireframes to multi-screen experiences.

Read more...

Next Generation Server Compression With Brotli

Chances are pretty good that you’ve worked with, or at least understand the concept of, server compression. By compressing website assets on the server prior to transferring them to the browser, we’ve been able to achieve substantial performance gains.

Next Generation Server Compression With Brotli

For quite some time, the venerable gzip algorithm has been the go-to solution for reducing the size of page assets. A new kid on the block has been gaining support in modern browsers, and its name is Brotli. In this article, you’ll get hands-on with Brotli by writing a Node.js-powered HTTP server that implements this new algorithm, and we’ll compare its performance to gzip.

Read more...

Breaking Out Of The Box: Design Inspiration (October 2016)

Whenever I work on an illustration, the objects don’t always have to look like they do in real life. They can look like how I perceive them in my mind. Breaking away from reality is the privilege you have as an illustrator. There are, in fact, no boundaries. Illustrating is creativity in its pure form. It is endless and that’s why I love it so much.

Breaking Out Of The Box: Design Inspiration (October 2016)

The illustration above is an inspiring example of using geometric shapes to create a bicycle with a minimum of detail. Sit back, relax, and feed your appetite. Here’s your monthly dose.

Read more...

Creating Universal Windows Apps With React Native

React.js is a popular JavaScript library for building reusable UI components. React Native takes all the great features of React, from the one-way binding and virtual DOM to debugging tools, and applies them to mobile app development on iOS and Android.

Creating Universal Windows Apps With React Native

With the React Native Universal Windows platform extension, you can now make your React Native applications run on the Universal Windows families of devices, including desktop, mobile, and Xbox, as well as Windows IoT, Surface Hub, and HoloLens.

Read more...

Finding Better Mobile Analytics

When creating a mobile application, a developer imagines a model and the way users will use the application. One problem that developers face is that users do not always use an app the way it was envisaged by the developer.

Finding Better Mobile Analytics

How do users interact with the app? What do they do in the app? Do they do what the developer wants them to do? Mobile analytics help to answer these questions. Analytics allow the developer to understand what happens with the app in real life and provide an opportunity to adjust and improve the app after seeing how users actually use it. To put it simply, analytics is the study of user behavior.

Read more...

Building “Topple Trump”, An Interactive Web-Based Quiz Game (Case Study)

Editor's Note: When it comes to elections, we are each given a choice in how to express our opinions and beliefs. Some designers and developers use their skills to further articulate their choice in one person. Here’s a glimpse into how Topple Trump!, an interactive responsive quiz game, was designed and built — combined with some valuable lessons learned along the way. This article is about techniques and strategies, so please avoid political flame in the comments.

Creating an online quiz that is simple to use, looks great and is really fun to play is one thing. Basing it on Donald Trump's polarizing presidential campaign is another.

Building 'Topple Trump', An Interactive Web-Based Quiz Game (Case Study)

The brainchild of Parallax director and developer Andy Fitch, Topple Trump! has gone on to win numerous awards. But it was a real team effort that brought the game to life. Here's a glimpse into precisely how that happened, touching on the development process, design considerations and some valuable lessons learned along the way.

Read more...

Desktop Wallpaper Calendars: October 2016

A new month means new wallpapers! This journey has been going on for eight years now, and each time anew artists and designers from across the globe challenge their artistic skills to cater for some fresh inspiration on your desktop. And, well, it wasn’t any different this time around.

Desktop Wallpaper Calendars: October 2016

This post features their designs for October 2016. The collection is a mix of ideas and styles, of wallpapers that are a little more distinctive than the usual crowd. All wallpapers come in versions with and without a calendar and can be downloaded for free — just choose your favorite. A big thank-you to everyone who shared their ideas with us! Happy October!

Read more...

Sponsored Article Building Hybrid Apps With ChakraCore

There are many reasons why one may want to embed JavaScript capabilities into an app. One example may be to take a dependency on a JavaScript library that has not yet been ported to the language you’re developing in. Another may be that you want to allow users to “eval” small routines or functions in JavaScript, e.g., in data processing applications.

Building Hybrid Apps with ChakraCore

The key reason for our investigation of ChakraCore was to support the React Native framework on the Universal Windows Platform, which is a framework for declaring applications using JavaScript and the React programming model.

Read more...

↑ Back to top