Curt Long

Using voice commands has become pretty ubiquitous nowadays, as more mobile phone users use voice assistants such as Siri and Cortana, and as devices such as Amazon Echo and Google Home¹ have been invading our living rooms. These systems are built with speech recognition software that allows their users to issue voice commands². Now, our web browsers will become familiar with to Web Speech API, which allows users to integrate voice data in web apps.

With the current state of web apps, we can rely on various UI elements to interact with users. With the Web Speech API, we can develop rich web applications with natural user interactions and minimal visual interface, using voice commands. This enables countless use cases for richer web applications. Moreover, the API can make web apps accessible, helping people³ with physical or cognitive disabilities or injuries. The future web will be more conversational and accessible!

In this tutorial, we will use the API to create an artificial intelligence (AI) voice chat interface in the browser. The app will listen to the user’s voice and reply with a synthetic voice. Because the Web Speech API is still experimental, the app works only in supported browsers⁵. The features used for this article, both speech recognition and speech synthesis, are currently only in the Chromium-based browsers, including Chrome 25+ and Opera 27+, while Firefox, Edge and Safari support only speech synthesis at the moment.

This video shows the demo in Chrome, and this is what we are going to build in this tutorial!

To build the web app, we’re going to take three major steps:

1. Use the Web Speech API’s SpeechRecognition interface to listen to the user’s voice.
2. Send the user’s message to a commercial natural-language-processing API as a text string.
3. Once API.AI returns the response text back, use the SpeechSynthesis interface to give it a synthetic voice.

⁸

The entire source code⁹ used for this tutorial is on GitHub.

Prerequisites Link

This tutorial relies on Node.js. You’ll need to be comfortable with JavaScript and have a basic understanding of Node.js.

Make sure Node.js¹⁰ is installed on your machine, and then we’ll get started!

Setting Up Your Node.js Application Link

First, let’s set up a web app framework with Node.js. Create your app directory, and set up your app’s structure like this:

. ├── index.js ├── public │ ├── css │ │ └── style.css │ └── js │ └── script.js └── views └── index.html 

Then, run this command to initialize your Node.js app:

$ npm init -f

The -f accepts the default setting, or else you can configure the app manually without the flag. Also, this will generate a package.json file that contains the basic info for your app.

Now, install all of the dependencies needed to build this app:

$ npm install express socket.io apiai --save

With the --save flag added, your package.json file will be automatically updated with the dependencies.

We are going to use Express¹¹, a Node.js web application server framework, to run the server locally. To enable real-time bidirectional communication between the server and the browser, we’ll use Socket.IO¹². Also, we’ll install the natural language processing service tool, API.AI¹³ in order to build an AI chatbot that can have an artificial conversation.

Socket.IO is a library that enables us to use WebSocket easily with Node.js. By establishing a socket connection between the client and server, our chat messages will be passed back and forth between the browser and our server, as soon as text data is returned by the Web Speech API (the voice message) or by API.AI API (the “AI” message).

Now, let’s create an index.js file and instantiate Express and listen to the server:

const express = require('express'); const app = express(); app.use(express.static(__dirname + '/views')); // html app.use(express.static(__dirname + '/public')); // js, css, images const server = app.listen(5000); app.get('/', (req, res) => { res.sendFile('index.html'); }); 

Now, let’s work on our app! In the next step, we will integrate the front-end code with the Web Speech API.

Receiving Speech With The SpeechRecognition Interface Link

The Web Speech API has a main controller interface, named SpeechRecognition¹⁶¹⁴, to receive the user’s speech from a microphone and understand what they’re saying.

Creating the User Interface Link

The UI of this app is simple: just a button to trigger voice recognition. Let’s set up our index.html file and include our front-end JavaScript file (script.js) and Socket.IO, which we will use later to enable the real-time communication:

<html lang="en"> <head>…</head> <body> … <script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/2.0.1/socket.io.js"></script> <script src="js/script.js"></script> </body> </html> 

Then, add a button interface in the HTML’s body:

<button>Talk</button>

To style the button as seen in the demo, refer to the style.css file in the source code¹⁵.

Capturing Voice With JavaScript Link

In script.js, invoke an instance of SpeechRecognition¹⁶¹⁴, the controller interface of the Web Speech API for voice recognition:

const SpeechRecognition = window.SpeechRecognition || window.webkitSpeechRecognition; const recognition = new SpeechRecognition();

We’re including both prefixed and non-prefixed objects, because Chrome currently supports the API with prefixed properties.

Also, we are using some of ECMAScript6 syntax in this tutorial, because the syntax, including the const and arrow functions, are available in browsers that support both Speech API interfaces, SpeechRecognition and SpeechSynthesis.

Optionally, you can set varieties of properties¹⁷ to customize speech recognition:

recognition.lang = 'en-US'; recognition.interimResults = false; 

Then, capture the DOM reference for the button UI, and listen for the click event to initiate speech recognition:

document.querySelector('button').addEventListener('click', () => { recognition.start(); }); 

Once speech recognition has started, use the result event to retrieve what was said as text:

recognition.addEventListener('result', (e) => { let last = e.results.length - 1; let text = e.results[last][0].transcript; console.log('Confidence: ' + e.results[0][0].confidence); // We will use the Socket.IO here later… }); 

This will return a SpeechRecognitionResultList object containing the result, and you can retrieve the text in the array. Also, as you can see in the code sample, this will return confidence for the transcription, too.

Now, let’s use Socket.IO to pass the result to our server code.

Real-Time Communication With Socket.IO Link

Socket.IO¹⁸ is a library for real-time web applications. It enables real-time bidirectional communication between web clients and servers. We are going to use it to pass the result from the browser to the Node.js code, and then pass the response back to the browser.

You may be wondering why are we not using simple HTTP or AJAX instead. You could send data to the server via POST. However, we are using WebSocket via Socket.IO because sockets are the best solution for bidirectional communication, especially when pushing an event from the server to the browser. With a continuous socket connection, we won’t need to reload the browser or keep sending an AJAX request at a frequent interval.

¹⁹

Instantiate Socket.IO in script.js somewhere:

const socket = io(); 

Then, insert this code where you are listening to the result event from SpeechRecognition:

socket.emit('chat message', text); 

Now, let’s go back to the Node.js code to receive this text and use AI to reply to the user.

Getting A Reply From AI Link

Numerous platforms and services enable you to integrate an app with an AI system using speech-to-text and natural language processing, including IBM’s Watson²⁰, Microsoft’s LUIS²¹ and Wit.ai⁴⁰²². To build a quick conversational interface, we will use API.AI, because it provides a free developer account and allows us to set up a small-talk system quickly using its web interface and Node.js library.

Setting Up API.AI Link

Once you’ve created an account, create an “agent.” Refer to the “Getting Started²³” guide, step one.

Then, instead of going the full customization route by creating entities and intents, first, simply click the “Small Talk” preset from the left menu, then, secondly, toggle the switch to enable the service.

²⁴

Customize your small-talk agent as you’d like using the API.AI interface.

Go to the “General Settings” page by clicking the cog icon next to your agent’s name in the menu, and get your API key. You will need the “client access token” to use the Node.js SDK.

Using the API.AI Node.js SDK Link

Let’s hook up our Node.js app to API.AI using the latter’s Node.js SDK! Go back to your index.js file and initialize API.AI with your access token:

const apiai = require('apiai')(APIAI_TOKEN); 

If you just want to run the code locally, you can hardcode your API key here. There are multiple ways to set your environment variables, but I usually set an .env file to include the variables. In the source code on GitHub, I’ve hidden my own credentials by including the file with .gitignore, but you can look at the .env-test²⁶ file to see how it is set.

Now we are using the server-side Socket.IO to receive the result from the browser.

Once the connection is established and the message is received, use the API.AI APIs to retrieve a reply to the user’s message:

io.on('connection', function(socket) { socket.on('chat message', (text) => { // Get a reply from API.AI let apiaiReq = apiai.textRequest(text, { sessionId: APIAI_SESSION_ID }); apiaiReq.on('response', (response) => { let aiText = response.result.fulfillment.speech; socket.emit('bot reply', aiText); // Send the result back to the browser! }); apiaiReq.on('error', (error) => { console.log(error); }); apiaiReq.end(); }); }); 

When API.AI returns the result, use Socket.IO’s socket.emit() to send it back to the browser.

Giving The AI A Voice With The SpeechSynthesis Interface Link

Let’s go back to script.js once again to finish off the app!

Create a function to generate a synthetic voice. This time, we are using the SpeechSynthesis controller interface of the Web Speech API.

The function takes a string as an argument and enables the browser to speak the text:

function synthVoice(text) { const synth = window.speechSynthesis; const utterance = new SpeechSynthesisUtterance(); utterance.text = text; synth.speak(utterance); } 

In the function, first, create a reference to the API entry point, window.speechSynthesis. You might notice that there is no prefixed property this time: This API is more widely supported than SpeechRecognition, and all browsers that support it have already dropped the prefix for SpeechSysthesis.

Then, create a new SpeechSynthesisUtterance()²⁷ instance using its constructor, and set the text that will be synthesised when the utterance is spoken. You can set other properties²⁸, such as voice to choose the type of the voices that the browser and operating system should support.

Finally, use the SpeechSynthesis.speak() to let it speak!

Now, get the response from the server using Socket.IO again. Once the message is received, call the function.

socket.on('bot reply', function(replyText) { synthVoice(replyText); }); 

You are done! Let’s try a chit-chat with our AI bot!

²⁹

Note that the browser will ask you for permission to use the microphone the first time. Like other web APIs, such as the Geolocation API and the Notification API, the browser will never access your sensitive information unless you grant it, so your voice will not be secretly recorded without your knowledge.

You will soon get bored with the conversation because the AI is too simple. However, API.AI is configurable and trainable. Read the API.AI documentation³¹ to make it smarter.

I hope you’ve enjoyed the tutorial and created a fun chatbot!

Push The Web To The Future! Link

Voice interaction has transformed the way users control computing and connected devices. Now with the Web Speech API, the user experience is transforming on the web, too. Combined with AI and deep learning, your web apps will become more intelligent and provide better experiences for users!

References Link

This tutorial has covered only the core features of the API, but the API is actually pretty flexible and customizable. You can change the language of recognition and synthesis, the synthetic voice, including the accent (like US or UK English), the speech pitch and the speech rate. You can learn more about the API here:

• “Web Speech API³²,” Mozilla Developer Network
• “Web Speech API Specification³³,” W3C
• “Web Speech API: Speech Synthesis³⁴” (Microsoft Edge documentation) Microsoft

Also, to learn Node.js and the libraries used in this tutorial, check out the following:

• Guide³⁵, Node.js
• Documentation³⁶, npm
• “Hello world example³⁷,” Express
• “Get Started³⁸,” Socket.IO

Finally, check out the different natural-language-processing tools and conversational platforms!

• API.AI³⁹, Google
• Wit.ai⁴⁰²², Facebook
• LUIS⁴¹, Microsoft
• Watson⁴², IBM
• Lex⁴³, Amazon

(rb, yk, al, il)

Footnotes Link

1. 1 https://www.smashingmagazine.com/2017/05/build-action-google-home-api-ai/
2. 2 https://www.smashingmagazine.com/2017/05/designing-voice-experiences/
3. 3 https://www.smashingmagazine.com/2015/03/web-accessibility-with-accessibility-api/
4. 4 https://www.smashingmagazine.com/2014/12/enhancing-ux-with-the-web-speech-api/
5. 5 http://caniuse.com/#search=speech
6. 6 https://www.smashingmagazine.com/wp-content/uploads/2017/06/browser-webspeech-large-opt-1.png
7. 7 https://www.smashingmagazine.com/wp-content/uploads/2017/06/browser-webspeech-large-opt-1.png
8. 8 https://www.smashingmagazine.com/wp-content/uploads/2017/06/chatapp_with_web-speech_api-preview-opt-1.png
9. 9 https://github.com/girliemac/web-speech-ai
10. 10 https://nodejs.org
11. 11 https://expressjs.com/
12. 12 https://socket.io
13. 13 https://api.ai
14. 14 https://developer.mozilla.org/en-US/docs/Web/API/SpeechRecognition
15. 15 https://github.com/girliemac/web-speech-ai
16. 16 https://developer.mozilla.org/en-US/docs/Web/API/SpeechRecognition
17. 17 https://developer.mozilla.org/en-US/docs/Web/API/SpeechRecognition
18. 18 https://socket.io/
19. 19 https://www.smashingmagazine.com/wp-content/uploads/2017/06/using_socketio-preview-opt-1.png
20. 20 https://www.ibm.com/watson/
21. 21 https://www.luis.ai/
22. 22 https://wit.ai/
23. 23 https://docs.api.ai/docs/get-started
24. 24 https://www.smashingmagazine.com/wp-content/uploads/2017/06/apiai-smalltalk-large-opt-1.png
25. 25 https://www.smashingmagazine.com/wp-content/uploads/2017/06/apiai-smalltalk-large-opt-1.png
26. 26 https://github.com/girliemac/web-speech-ai/blob/master/.env_test
27. 27 https://developer.mozilla.org/en-US/docs/Web/API/SpeechSynthesisUtterance
28. 28 https://developer.mozilla.org/en-US/docs/Web/API/SpeechSynthesisUtterance
29. 29 https://www.smashingmagazine.com/wp-content/uploads/2017/06/webspeech-api-demo.gif
30. 30 https://www.smashingmagazine.com/wp-content/uploads/2017/06/webspeech-api-demo.gif
31. 31 https://docs.api.ai/
32. 32 https://developer.mozilla.org/en-US/docs/Web/API/Web_Speech_API
33. 33 https://dvcs.w3.org/hg/speech-api/raw-file/tip/speechapi.html
34. 34 https://docs.microsoft.com/en-us/microsoft-edge/dev-guide/multimedia/web-speech-api
35. 35 https://nodejs.org/en/docs/guides/
36. 36 https://docs.npmjs.com/
37. 37 https://expressjs.com/en/starter/hello-world.html
38. 38 https://socket.io/get-started/
39. 39 https://api.ai/
40. 40 https://wit.ai/
41. 41 https://www.luis.ai/
42. 42 https://www.ibm.com/watson/
43. 43 https://aws.amazon.com/lex/

↑ Back to topTweet itShare on Facebook

The world around us is full of little things and experiences that shape us, our way of thinking, but also how we tackle our work. Influenced by these encounters, every designer develops their unique style and workflow, and studying their artwork — the compositions, geometry of lines and shapes, light and shadows, the colors and patterns¹ — can all inspire us to look beyond our own horizon and try something new.

It really doesn’t take much to let your mind wander. Always remember to take a closer look at things around you; you’ll be sure to find inspiration in the little things². But for now, let’s dig into another collection of brilliant illustrations and photographs.

Get Ready: It’s Friday Link

What a great friendly vintage atmosphere! Well done.

o r i g i n s Link

Latest project from Maria Svarbova. Again, cleverly playing with symmetry and color.

⁶

Inventing The Future Of Space Link

Diging the retro-futuristic-exciting style in this one.

⁸

Cafe Racer Link

Perfect lines and shapes, but also such great use of color.

¹⁰

Cycling Plus Magazine Link

Loving the special color choices in this illustration, and all of the movement that’s been going on.

¹²

Stop! Tomato Time. Link

You should always stop to taste a delicious tomato. I like the atmosphere created in this one.

¹⁴

DuJour Link

Clever concept and execution mixed with subtle use of color and texture.

¹⁶

Food & Nutrition Magazine Link

Great black silhouette to use as a centerpiece in this illustration so that everything else can be in color.

¹⁸

Time Travel Link

A brilliant choice of style and textures in this one!

²⁰

Exploration Link

Wow. Now these are some exceptional colors. Loving the vibrant contrast!

²²

Essensys Link

This one has quite a special style and excellent usage of textures.

²⁴

Radiohead Berkeley Link

DKNG got to create a poster for their favorite band Radiohead playing at the iconic Greek Theater in Berkeley, CA. Beautiful geometrical design with superb dark shadows and light effects.

²⁶

REI 4th of July Link

It’s a wonderful thing to get to see the imagination of an illustrator who thinks “imagining what it would be like to paddle a kayak on those serene sunset waters”… The colors and gradients used here to reflect the sunset are just so well done.

²⁸

Mountain Barn Link

Just look at that view!

³⁰

Google People Link

Nicely designed character poses. I love the subtle background elements and overall cute style.

³²

The Golden Cage Link

Gorgeous style by Carll Cneut from Belgium.

³⁴

Heavy Eyes Link

All those lovely eyes!

³⁶

Moraine Lake, Banff Link

I love these reflections and the beautifully soft light. Such an incredible and tranquil image.

³⁸

Men’s Health – Realty Check Link

On point! Part of the head makes me think about Magnum P.I. played by Tom Selleck.

⁴⁰

Comfortable Giant Link

Nice work, especially the color choices and the toned down background scene.

⁴²

Siesta Beach Link

Pretty spectacular sunset at Siesta Key Beach.

⁴⁴

Hemingway Link

Great illustration by Sébastien Plassard. The beard and the hair are simply beautiful.

⁴⁶

Oklahoma Storm Link

Incredible shot captured in Keyes, Oklahoma by storm chaser @VanessaNeufeld⁴⁸.

⁴⁹

Guardian – What I’ll Be Reading Link

Really nice illustration and some inspiring color choices.

⁵¹

The Hound And The Hare Link

The patterns throughout this piece are mesmerizing. Loving that gold accent color as well.

⁵³

Johns Hopkins Magazine Link

Loving those candy colors. Also look at that skateboard! I love this ‘gummy’ bendable look.

⁵⁵

Opentable Link

Such beautiful contrasts! The subtle textures like on the lobster gives this one an edge.

⁵⁷

Curious Case Society Inductee Manual V.7 Link

That eagle and those hand combos combined with the typography are making this a great shot.

⁵⁹

Le Tour de France Link

The yearly circus every July.

⁶¹

Esquire’s Big Black Book Link

Nice example of using just two colors.

⁶³

Wired World 2017 Link

Great composition of a scene in which shapes are being used as either desks or surfaces to stand on.

⁶⁵

Insects And Other Arthropods Link

Wonderful school posters!

⁶⁷

Diversity Link

Super dope! I love the pattern on the sweater. The faces and different beard styles are also ace.

⁶⁹

Les Echos Link

Great diverse bunch of characters.

⁷¹

Greetings From San Francisco Link

Very nice to see all hallmark sights nicely integrated into the letters.

⁷³

Tour de France Impressions Link

Enjoying the style, especially the lines that just guide you to see the rest.

⁷⁵

A Different View Link

The iron work on the fences and patterns on the tiles in this Morrocan riad is so beautiful. The colors are also perfect.

⁷⁷

TRUE Webhosting Link

A beautiful style with some isometric influences.

⁷⁹

Picture Me Rollin’ Link

Interesting approach to the tire shapes. Those are some lovely soft tones as well.

⁸¹

Growth Link

Beautiful! Love the movement.

⁸³

Fish Link

Great graphical elements on the fish.

⁸⁵

Open The Door… Link

Classic and elegant. Love the metaphor to open the door for better weather or a new season.

⁸⁷

Adventure Link

Illustrations that explore imagination are always among my favorites. Thumbs up for the muted color palette as well.

⁸⁹

Horse House Link

It’s great to see how all those ‘etch’ lines are capable of accentuating the details in this illustration.

⁹¹

Stairhaus Inc. Link

Colors and composition are on point.

⁹³

Field Trip 2017 Link

Wonderful badge art for Field Trip Music Festival‘s 2017 branding.

⁹⁵

Cyrus Shey Link

Not an ordinary everyday color palette. Love the sense of speed in it.

⁹⁷

Tropical Galaxy Link

Top notch work as always with an inspiring color selection.

⁹⁹

Fleet Foxes Link

The right mix of floral elements to achieve a perfect balance.

¹⁰¹

Kirkjufell, Iceland Link

Those soft subdued tones and light really compliment the wild and remote feeling of this scene. Composed perfectly as well with just one inclusion of the person.

¹⁰³

Footnotes Link

1. 1 https://www.smashingmagazine.com/2017/03/inspiring-illustrations-bright-colors-cool-patterns/
2. 2 https://www.smashingmagazine.com/2017/05/finding-inspiration-illustrations/
3. 3 https://www.smashingmagazine.com/web-tech-front-end-ux-conferences/
4. 4 https://handsomefrank.com/illustrators/paul-thurlby/
5. 5 https://handsomefrank.com/illustrators/paul-thurlby/
6. 6 https://www.behance.net/gallery/54620013/o-r-i-g-i-n-s
7. 7 https://www.behance.net/gallery/54620013/o-r-i-g-i-n-s
8. 8 https://www.behance.net/gallery/54603365/Inventing-the-future-of-space
9. 9 https://www.behance.net/gallery/54603365/Inventing-the-future-of-space
10. 10 https://dribbble.com/shots/3257849-Cafe-Racer
11. 11 https://dribbble.com/shots/3257849-Cafe-Racer
12. 12 http://stevescott.com.au/cycling-plus-illustrations
13. 13 http://stevescott.com.au/cycling-plus-illustrations
14. 14 https://dribbble.com/shots/3440738-Stop-Tomato-time
15. 15 https://dribbble.com/shots/3440738-Stop-Tomato-time
16. 16 http://strautniekas.com/#/dujour/
17. 17 http://strautniekas.com/#/dujour/
18. 18 https://markallenmillerillustration.com/work/#/food-nutrition-magazine/
19. 19 https://markallenmillerillustration.com/work/#/food-nutrition-magazine/
20. 20 https://dribbble.com/shots/3634498-Time-Travel
21. 21 https://dribbble.com/shots/3634498-Time-Travel
22. 22 https://dribbble.com/shots/3634954-Exploration
23. 23 https://dribbble.com/shots/3634954-Exploration
24. 24 https://dribbble.com/shots/3633823-Illustration-for-the-essensys-tech-part-2
25. 25 https://dribbble.com/shots/3633823-Illustration-for-the-essensys-tech-part-2
26. 26 https://www.dkngstudios.com/blog/2017/5/10/radiohead-berkeley-ca-poster
27. 27 https://www.dkngstudios.com/blog/2017/5/10/radiohead-berkeley-ca-poster
28. 28 https://www.behance.net/gallery/54228825/REI-4th-of-July
29. 29 https://www.behance.net/gallery/54228825/REI-4th-of-July
30. 30 https://unsplash.com/photos/okzxVsJNxXc
31. 31 https://unsplash.com/photos/okzxVsJNxXc
32. 32 https://dribbble.com/shots/3495164-Google-people
33. 33 https://dribbble.com/shots/3495164-Google-people
34. 34 http://blog.picturebookmakers.com/post/162038451911/carll-cneut
35. 35 http://blog.picturebookmakers.com/post/162038451911/carll-cneut
36. 36 https://dribbble.com/shots/3502284-Heavy-Eyes/attachments/774417
37. 37 https://dribbble.com/shots/3502284-Heavy-Eyes/attachments/774417
38. 38 https://www.instagram.com/p/BWMCZgGARLD/
39. 39 https://www.instagram.com/p/BWMCZgGARLD/
40. 40 https://www.behance.net/gallery/53243771/Mens-Health-Realty-Check
41. 41 https://www.behance.net/gallery/53243771/Mens-Health-Realty-Check
42. 42 https://dribbble.com/shots/3525880-Comfortable-Giant
43. 43 https://dribbble.com/shots/3525880-Comfortable-Giant
44. 44 https://www.instagram.com/p/BWJB6Isjn8O/
45. 45 https://www.instagram.com/p/BWJB6Isjn8O/
46. 46 http://www.newyorker.com/magazine/2017/07/03/hemingway-the-sensualist
47. 47 http://www.newyorker.com/magazine/2017/07/03/hemingway-the-sensualist
48. 48 https://twitter.com/vanessaneufeld
49. 49 http://www.nationalgeographic.com/photography/photo-of-the-day/2017/07/lightning-oklahoma-storm/
50. 50 http://www.nationalgeographic.com/photography/photo-of-the-day/2017/07/lightning-oklahoma-storm/
51. 51 http://www.owengatley.co.uk/Guardian-1
52. 52 http://www.owengatley.co.uk/Guardian-1
53. 53 https://dribbble.com/shots/3647196-The-Hound-and-The-Hare
54. 54 https://dribbble.com/shots/3647196-The-Hound-and-The-Hare
55. 55 https://dribbble.com/shots/2720062-Johns-Hopkins-Magazine
56. 56 https://dribbble.com/shots/2720062-Johns-Hopkins-Magazine
57. 57 http://www.owengatley.co.uk/Opentable-2
58. 58 http://www.owengatley.co.uk/Opentable-2
59. 59 https://dribbble.com/shots/3647366-Curious-Case-Society-Inductee-Manual-V-7
60. 60 https://dribbble.com/shots/3647366-Curious-Case-Society-Inductee-Manual-V-7
61. 61 http://www.spencerwilson.co.uk/The-Devil-of-the-Tour-de-France
62. 62 http://www.spencerwilson.co.uk/The-Devil-of-the-Tour-de-France
63. 63 https://www.behance.net/gallery/50107071/The-Big-Black-Book
64. 64 https://www.behance.net/gallery/50107071/The-Big-Black-Book
65. 65 https://www.behance.net/gallery/45837249/Wired-World-2017
66. 66 https://www.behance.net/gallery/45837249/Wired-World-2017
67. 67 http://loulouandtummie.com/portfolio-posts/school-posters/
68. 68 http://loulouandtummie.com/portfolio-posts/school-posters/
69. 69 https://dribbble.com/shots/3651124-Diversity
70. 70 https://dribbble.com/shots/3651124-Diversity
71. 71 https://www.instagram.com/p/BUQ9PmnlPUY/
72. 72 https://www.instagram.com/p/BUQ9PmnlPUY/
73. 73 https://dribbble.com/shots/3654229-Greetings-From-San-Francisco-Art-Print
74. 74 https://dribbble.com/shots/3654229-Greetings-From-San-Francisco-Art-Print
75. 75 https://www.behance.net/gallery/54552101/Tour-de-France-Impressions
76. 76 https://www.behance.net/gallery/54552101/Tour-de-France-Impressions
77. 77 https://www.behance.net/gallery/49835323/A-Different-View
78. 78 https://www.behance.net/gallery/49835323/A-Different-View
79. 79 https://www.behance.net/gallery/54177329/TRUE-Webhosting
80. 80 https://www.behance.net/gallery/54177329/TRUE-Webhosting
81. 81 https://dribbble.com/shots/3638666-Picture-me-rollin
82. 82 https://dribbble.com/shots/3638666-Picture-me-rollin
83. 83 https://dribbble.com/shots/3669915-Growth
84. 84 https://dribbble.com/shots/3669915-Growth
85. 85 https://dribbble.com/shots/3671641-Fish
86. 86 https://dribbble.com/shots/3671641-Fish
87. 87 https://www.instagram.com/p/BR5KyutDfI5/
88. 88 https://www.instagram.com/p/BR5KyutDfI5/
89. 89 https://www.behance.net/gallery/54018849/Adventure
90. 90 https://www.behance.net/gallery/54018849/Adventure
91. 91 https://www.behance.net/gallery/48760879/Horse-House
92. 92 https://www.behance.net/gallery/48760879/Horse-House
93. 93 https://dribbble.com/shots/3444323-Stairhaus-Inc
94. 94 https://dribbble.com/shots/3444323-Stairhaus-Inc
95. 95 https://dribbble.com/shots/3367476-Field-Trip-2017
96. 96 https://dribbble.com/shots/3367476-Field-Trip-2017
97. 97 https://www.behance.net/gallery/53277765/Cyrus-Shey-Big-Posters
98. 98 https://www.behance.net/gallery/53277765/Cyrus-Shey-Big-Posters
99. 99 https://www.dkngstudios.com/blog/2017/7/24/almanac-beer-co-tropical-galaxy
100. 100 https://www.dkngstudios.com/blog/2017/7/24/almanac-beer-co-tropical-galaxy
101. 101 https://dribbble.com/shots/3689403-fleet-foxes
102. 102 https://dribbble.com/shots/3689403-fleet-foxes
103. 103 https://www.instagram.com/p/BW6Gi6TgHxz/
104. 104 https://www.instagram.com/p/BW6Gi6TgHxz/

↑ Back to topTweet itShare on Facebook

If you’re like me, then being persuaded requires a scientific approach and concrete examples. And that’s exactly what this article does. It explains how gamification can work by showing the relationship between gamification, UX design, and BJ Fogg’s modern persuasion phenomenon, “mass interpersonal persuasion.” And it has a lot of practical gamification examples that you can apply to your own products for more engaging experiences.

Today, virtually all companies (except for special ones like Basecamp¹) have to grow non-stop. Why? Well, that’s simply how the capitalist engine works. Investors pour money into startups, banks loan money to entrepreneurs, employees accept stock options instead of cash, all in the hope of the company growing much bigger. That’s why there is so much emphasis on growth. Otherwise, the whole system would collapse. It’s kind of crazy when you think a bit more deeply about it, but I’ll leave that part to you for now.

What we call “growth” in the tech world is called “persuasion” in academia. With this article, I want to show why gamification is a great tool for growth and how persuasion science (more precisely, the “mass interpersonal persuasion” phenomenon) proves that. I’ll do that with examples and facts. Let’s get going.

Two Misnomers: “User Experience Design” And “Gamification” Link

I think a lot about words, their meanings and how they shape our perception. This is of special importance to us UX and product people because we’re flooded with jargon. Let’s look at the following example to better understand the importance of words.

“UX is not UI” is a common reproach, and it is correct. Thanks to this famous photograph above, we now better understand that UX is not UI. But UX — or, more precisely, user experience design — is not usability either, as implied in the photograph. It requires an understanding of business goals as well as user needs and satisfaction of both, in a coherent fashion. But because the term “user experience design” does not imply anything about business, nobody talks about business. Daniel Kahneman, Nobel Prize winner in Economics, has a term for this phenomenon: What you see is all there is⁴. We do not see “business” in user experience design, so it becomes all about users.

⁵

Gamification is another victim of misnaming. Contrary to popular belief, it does not entail users playing or giving them points. Yes, those are useful components, but not the whole thing. The purpose of gamification is not to make people have fun, either. The purpose is to use fun to motivate people towards certain behaviors. Motivation is the key here. As shown⁶ above by Michael Wu, motivation and game components are in parallel. That’s why we use gamification to motivate users. If that parallel were provided by something else — say, biology — then we’d use biologification to motivate users.

So, what is gamification? One of my favorite definitions comes from Juho Hamari⁷ of Tampere University of Technology:

Gamification is a process of enhancing a service with affordances for gameful experiences in order to support user’s overall value creation.

My other favorite definition comes from Kevin Werbach⁸ of the University of Pennsylvania:

Gamification is the process of making activities more game-like. In other words, it covers coordinated practices that objectively manifest the intent to produce more of the kinds of experiences that typify games.

As much as I like the definitions above, I still miss the emphasis on motivation and behaviors. So, here goes my definition of gamification:

Gamification is about using game-like setups to increase user motivation for behaviors that businesses target.

Naturally, my definition resembles user experience design. It does that by mixing the first two definitions. I’ve tried to convey how gamification satisfies users and businesses at the same time. I am not sure which definition is the most accurate, but I know this for sure: We have been playing games since we lived in caves, and we enjoy them for some reason. It’s only sensible to get inspiration from games, be it for business, education or something else.

Persuasion Link

If we want to understand persuasion⁹, then we should understand, before anything else, that people are predictably irrational¹⁰. Predictably irrational means that, even though people do not behave rationally most of the time, there are still patterns in this irrationality that help us predict future behaviors. This is why logic alone is not enough to persuade people. If people were consistently rational beings, then we would be living in a completely different world. For example, TV ads would merely consist of logical statements instead of gorgeous video productions. Coca-Cola ads would be like, “Coca Cola > Pepsi,” and Sony’s famous “Like no other” slogan would turn into “Sony !≈ anything else.”

Persuasion requires understanding neurology, psychology, biology, technology… a lot of “-ologies”. But arguably, the most important of all these ologies is technology, thanks to the unprecedented advancements in Internet and mobile in the last decade.

¹¹

So much so that BJ Fogg said the following¹² (PDF, 208 KB):

This phenomenon (Mass Interpersonal Persuasion) brings together the power of interpersonal persuasion with the reach of mass media. I believe this new way to change attitudes and behavior is the most significant advance in persuasion since radio was invented in the 1890s.

Bear in mind that, from a scientific point of view, persuasion is an umbrella term¹³ for affecting people’s attitudes, behaviors, intentions or beliefs. It does not necessarily require changing people’s beliefs or ideas.

Let me give you an example.

My father, 62 years old, has always been critical of iPhones because he finds the prices unreasonable — not because he cannot afford one, but because an iPhone 7 Plus (256 GB) costs almost four times the minimum wage in Turkey, where we live. But he bought an iPhone 7 for himself last month. How come? Well, for a year or so, he has been telling me how his friends have these big-screen phones and show him pictures of their grandchildren. Eventually, he got fed up with not being able to do the same and bought an iPhone 7. (All he needs now is a grandchild… sigh!) He still finds it expensive, but he bought it anyway. His idea did not change, but his behavior did. That’s what we call persuading without changing beliefs.

Mass Interpersonal Persuasion And Gamification Link

In 2007 a new form of persuasion emerged: mass interpersonal persuasion (MIP). The advances in online social networks now allow individuals to change attitudes and behaviors on a mass scale.

This is how BJ Fogg defines MIP¹⁴. The advances he mentions in the definition start with the launch of Facebook Platform in 2007. Facebook Platform is an aggregation of services and products available to third-party developers so that they can create games, applications and other services using Facebook data. Facebook’s success triggered other platforms to provide similar services. Fast-forward to today: We are living in an era when we type passwords no more, thanks to sign-in with Facebook, Google and Twitter. Or, if we want something more advanced, we can get a personality analysis¹⁵ just by providing our Twitter handle. For an example that’s even more advanced — and scary — we can look at the debates on Facebook’s alleged influence on the latest US elections¹⁶. This is how powerful social platforms are today.

MIP consist of six components. To better understand MIP and its connection to gamification, let’s look at what they are, one by one, with examples.

1. Persuasive Experience Link

The following quote (and the remaining ones in this article) is taken from BJ Fogg¹⁷:

An experience that is created to change attitudes, behaviors, or both.

The key here is the intentionality to change behaviors or attitudes by providing experiences, as opposed to just stating facts and expecting people to be reasonable enough to change their behaviors or attitudes accordingly.

Now, let’s remember our definition of gamification:

Gamification is using game-like setups to increase user motivation for behaviors that businesses target.

Similar to MIP, gamification is quite intentional about changing behaviors. It does that by focusing on the entirety of the users’ experience to find the relevant spots where it can blend in the experience and do its magic. A great example of this is Sweden’s Speed Camera Lottery. The Speed Camera Lottery is a simple solution. If you do not drive over the speed limit, then you instantly get a chance to participate in a lottery. Even funnier is that the winnings comes from the fines paid by speeders.

To better understand the intentionality behind behavior change, let’s compare the Speed Camera Lottery with the campaign of New York City’s Department of Transportation (NYC DOT).

¹⁸

¹⁹

Sweden’s Speed Camera Lottery

NYC DOT’s campaign is quite impressive, with its powerful visual and message. “Hit at 40 mph: There’s a 70% chance I’ll die. Hit at 30 mph: There’s an 80% chance I’ll live.” It’s hard to compare these two campaigns because the cultures in these two countries differ quite a lot, and NYC DOT’s campaign encompasses a lot of different initiatives, such as new traffic signals, speed bumps, and pedestrian walkways. However, when viewed from a purely behavioral science point of view, the Speed Camera Lottery is more likely to influence the behavior of obeying the speed limit. Why?

• The NYC campaign favors an indirect way of influencing behavior. It’s very influential when we see it, but it is not there when we actually need to slow down. Unlike the NYC DOT ad, the lottery solution is implemented right when and where speeding happens.
• NYC DOT’s campaign does not create an experience. It’s an example of a classic one-way communication. You see it and it’s gone. With the Speed Camera Lottery, we get a chance to participate and, thus, have an experience.
• The Speed Camera Lottery is more fun than the NYC DOT’s campaign because the former is a well-gamified campaign and the latter is basically an informative ad.

That being said, though highly successful (reducing the average speed by 22%²⁰), the Speed Camera Lottery had one downside. Some geniuses started circling around to increase their likelihood of winning the lottery. Well, that did not quite work out for them, but we should always be wary of cheaters.

2. Automated Structure Link

Digital technology structures the persuasive experience.

We saw how the core of gamification is to create persuasive experiences with the first component of MIP. Now let’s look at the link between gamification and automated structures.

By design, gamification produces well-structured processes. Regardless of what product we are building, we need a tool to quantify behaviors to even start with gamification. Think of something similar to Google Analytics or MixPanel. For behavior tracking to be useful, we do not just count how many people perform a certain behavior, but rather define rules like, “If a user clicks five help links in a session, then open the chat window.” Gamification, by nature, is built on top of these kinds of rules:

• Automated feedback: “If a user logs in for five consecutive days, then show them a message to congratulate them on their consistency.”
• Points: “If a user invites a friend, then reward them with 5 points.”
• Levels: “If a user collects 1000 points and receives 5 likes, then bump them up to level 3.”

We could easily add more examples to the list. Obviously, these are very simple examples, but the point is that gamification is inherently based on rules. That’s why it is very easy to build an automated structure to create a persuasive experience using gamification.

Example: Nike Fuel

²¹

Fuel presents a lot of examples of automated structure here.

• The daily average feedback is simply provided by averaging daily fuel points.
• The “way to go” feedback is simply generated by comparing the total number of Nike Fuel points earned in the last two days.
• The “Earn more active hours” call to action is generated simply by tracking the user’s active hours and comparing it to the daily goal.

Example: FitWell

²²

I did gamification design for FitWell²³, an app that tailors meal plans and workout regimens according to the app’s assessment. Our research showed that the most important problem people encounter during their fitness journey is that they lack feedback after a while. At the beginning, we feel energized, see changes in our posture and, thus, feel motivated. After a while, though, progress slows, and we start worrying that our efforts are accomplishing nothing. That’s where gamification comes into play. With a lot of automated feedback loops, users get various encouraging feedback when their body fails to provide any.

Example: Duolingo

²⁴

Duolingo takes the automated experience a step further with “Shop.” Thanks to the shop, not only do I get feedback on my progress, but I also get to reward myself with Lingots (the in-app currency) all by myself.

Yes, we do not have to gamify our products to provide these kinds of experiences, but it is much easier if we do. Gamification forces us to think of actions and feedbacks that, by nature, produce an automated structure.

3. Social Distribution Link

The persuasive experience is shared from one friend to another.

We just saw how gamification helps us with automating persuasive experiences. Now let’s see how gamification fuels social distribution.

Just four words: “Invite friends, earn money!” Money here is a variable. It could be anything from free disk space to an invitation to that new cool app. The key here is that it always involves friends and some kind of reward.

Example: Dropbox

²⁵

Notice how Dropbox not only offers rewards but also makes it extremely easy to share.

Example: Airbnb

²⁷

Airbnb does everything Dropbox does and take it a step further: If your friend travels using Airbnb, then you get $75 more.

Example: Flipkart

²⁹

The pattern is obvious by now: invite → sign up → earn money → perform extra behavior → earn even more money.

But that is not necessarily the only way. Look at what Gmail does with Inbox.

Example: Inbox

³¹

Do you remember the days when Inbox came out? Did you too harass your friends for an invitation, like my friends did to me?

Gmail had more than 500 million users when Inbox was released as an invitation-only product. So, obviously, Inbox was not after acquisition. But what was it after?

Adoption. This is why it turned the social distribution scheme upside down. Instead of rewarding people with money or free disk space, it rewarded people with the privilege of having invitations. Those privileged people (the innovators and early adopters³³) were already going to try Inbox. By giving innovators and early adopters a higher status, Google turned them into a distribution tool. Limited access made the early majority crave for Inbox, which in turn both accelerated adoption and increased the satisfaction of those lucky enough to use Inbox.

Has it worked for Google? I don’t know the exact numbers, but the screenshot above, along with insights from an ex-Google product manager³⁴, are key signals that it worked out very well for Google.

Speaking of the “Invite people and earn X” tactic, I have this friend who subscribed to a healthy-eating service that gives free meals in exchange for invitations. Following this tactic, he eventually had to cancel his subscription because he brought on too many people and ended up gaining more weight!

4. Rapid Cycle Link

What this means is that the time between invitation, acceptance, and a subsequent invitation needs to be small.

On a more abstract level, rapid cycle can be restated as follows:

What this means is that the time between action, feedback, and a subsequent action needs to be small.

When viewed like this, Nir Eyal’s hook model³⁵, the most important tool in my gamification toolbox, perfectly matches rapid cycle. ‘Hook’ is Nir’s explanation for why some products are so habit forming. Simply put, we get motivated if we get positive and instant feedback for our behaviors. Even better, if we get a chance to take a further step, we get even more motivated.

³⁶

I won’t explain the whole hook model here, but here is the gist:

1. Hook has its roots — surprise, surprise — in BJ Fogg’s behavior model³⁷, which explains how behavior occurs. BJ Fogg shows that we need a trigger, motivation, and ability to perform a behavior.
2. On top of Fogg’s behavior model, Nir Eyal adds a variable reward, so that people keep coming for more.
3. And Eyal asks for an investment behavior, which increases the user’s expectation of even more rewards in the future.

Let’s see a couple of examples of the hook model.

Examples

³⁸

³⁹

⁴⁰

(RJ Metrics Blog, Janessa Lantz)

5. Huge Social Graph Link

The persuasive experience can potentially reach millions of people connected through social ties or structured interactions.

Having millions of users is not enough for MIP to happen. What you need is millions of connected people, and the nice part is that they do not have to be your users either. You need the potential to reach millions. How? Well, for one, there are social networks. Use social log-in and leverage your users’ networks on those platforms. But that is not the only way. Suppose you have a SaaS analytics product. How can you reach millions? Provide Google Analytics integration and voilà! Now you’re relevant to millions of people.

Let’s look at how gamification helps connect people.

Example: Quora

⁴¹

Quora’s “Ask to Answer”

Quora suggests people with related expertise when we ask a question. This is an amazing solution. Why?

1. It helps us get answers much faster and from reliable sources.
2. It honors people who get asked to answer, which gets them motivated and engaged. (A common phrase on Quora is, “Thank you for A2A.”)
3. The combination of points 1 and 2 increases high-quality content, engagement and connectedness on Quora.

And this is all possible thanks to a very simple game mechanic: mastery. None of this would work if Quora did not have those domain experts.

Example: Yemeksepeti

⁴²

This example is from my hometown — hence, the language in the photo. Yemeksepeti is the Turkish version of Delivery Hero. They recently introduced a “muhtar” feature. Muhtar means “headman” in Turkish. A muhtar knows everyone and every detail about a neighborhood. So, the one with the most points in a neighborhood becomes the muhtar. As you can see, Alper G. is the muhtar in my neighborhood (the list on the right is the leaderboard).

I’ve been using Yemeksepeti for more than five years, and this is the first time I’ve been more curious about the people using it than about the restaurants on Yemeksepeti. The reason is the muhtars. Not only does it show who a neighbourhood’s muhtar is, but it also shows their recent orders and what other participants are doing on Yemeksepeti. The muhtar feature provides the basic social-proof mechanism that Yemeksepeti needed. It helps greatly with making faster decisions and increases the credibility of the restaurants’ scores. (People score a restaurant after a delivery, similar to scoring an Uber driver.)

The Muhtar feature also paves the way for Yemeksepeti to introduce its own version of A2A. I don’t know if they plan to do this (although it’s one of the ideas we presented to them four years ago), but they could surface experts who help others answer the toughest of all questions: “What should I eat?”

That’s the power of gamification. By introducing competition (or collaboration, as we saw with Quora), it makes socialization possible on a very large scale without people actually having to know each other.

6. Measurable Impact Link

The effect of the persuasive experience is observable by users and creators.

One of the core components of gamification is quantification of what users do and of the things happening around them. This way, gamification makes everything measurable by nature. Even the tiniest of behaviors are quantified and presented in various ways, sometimes as raw data, other times as points, levels or progress bars. Let’s look at some examples.

Example: Twitter

⁴⁴

Everything, including followers, moments, likes and retweets, is quantified and put front and center.

Example: Quora and Medium

⁴⁶

⁴⁸

Medium stats (View large version⁴⁹)

Medium and Quora are very different in how people create content, but in the end, it is content they create. That’s why it is not surprising to see that almost identical statistics are provided.

Summary Link

• Similar to MIP’s persuasive experience component, good gamification always directly targets behaviors and blends in the experience.
• MIP relies on automated structures, and gamification relies on behavior-based rules, which makes it extremely easy to build automated structures.
• MIP requires social distribution, and gamification responds to this with a killer feature: Invite friends and earn money, disk space, beta participation etc. This is an old gamification practice and a powerful social-distribution tool. And you do not always have to give away “stuff.” Giving away status works, too.
• Rapid cycles are at the heart of MIP. They are at the core of gamification, too, as shown by Nir Eyal’s hook model. People get motivated when the feedback for their behavior is instant. To take it a step further, try to make the feedback variable and the next step obvious.
• Another important component of MIP is a huge social graph. Collaboration and competition mechanics make it easy to connect people to each other, even on the least likely of platforms.
• Lastly, MIP requires people to be able to measure the impact of their behaviors. Gamification inherently requires measuring almost everything, which makes it extremely easy to make visible at all times.
• Gamification aims to use fun in order to motivate users towards behaviors that businesses target. This approach satisfies both the user and the behavior, which is essential to good user experience design.

Conclusion Link

One by one, we saw how the six components of mass interpersonal persuasion relate to gamification, with examples. I chose well-known examples so that they would be easier to understand and relate to. However, I realize that this makes gamification design intimidating. You might be thinking, “Of course, Quora would do that — they have all of these great designers,” or, “Obviously, Nike would succeed — they have all of those technologies and tools”. Perhaps also, “What does MIP have to do with growth?”. Take a look at this:

⁵⁰

Let’s go back to the fall of 2007 — a time when there was no WhatsApp, Instagram or Snapchat, when Twitter was a one-year-old baby, when Facebook announced its Platform. When BJ Fogg heard about Platform, he decided to start a new course to apply MIP principles to Facebook and measure the impact of the application of those principles. Grading was based on metrics on the Platform. There was no homework or quizzes. Students were graded based on the number of users they’ve reached and engaged through the apps they’ve built.

The numbers shown in the image above are the results of that course. The students, some of whom had no experience in coding, design or digital marketing, reached 16 million users in 10 weeks. And this happened in 2007. 2007 is the year when the first iPhone was unveiled. Think about it: Some of those apps generated so much revenue (more than $1 million in three months) that even the teaching assistant, Dan Ackerman, dropped out of school. Five of those apps made it to the top-100 apps on Facebook and reached more than 1 million users each.

So, if those students were able to design such successful experiences, why couldn’t you?

(cc, vf, yk, al, il)

Footnotes Link

1. 1 https://basecamp.com/
2. 2 https://www.smashingmagazine.com/2012/04/gamification-ux-users-win-lose/
3. 3 https://www.smashingmagazine.com/wp-content/uploads/2017/06/01-The-Surprising-Relationship-Between-Gamification-and-Modern-Persuasion-preview-opt.png
4. 4 https://jeffreysaltzman.wordpress.com/2013/04/08/wysiati/
5. 5 https://www.smashingmagazine.com/wp-content/uploads/2017/06/02-The-Surprising-Relationship-Between-Gamification-and-Modern-Persuasion.gif
6. 6 https://community.lithium.com/t5/Science-of-Social-Blog/Gamification-101-The-Psychology-of-Motivation/ba-p/21864
7. 7 http://juhohamari.com/post/33158604130/gamification
8. 8 http://bit.ly/2wdbqFW
9. 9 https://www.smashingmagazine.com/2009/10/how-to-persuade-your-users-boss-or-clients/
10. 10 http://zsoltbabocsai.org/dan-ariely-predictably-irrational/#sthash.lPGM1tBd.ejks7n5V.dpbs
11. 11 https://www.smashingmagazine.com/wp-content/uploads/2017/06/03-The-Surprising-Relationship-Between-Gamification-and-Modern-Persuasion-800w-opt.jpeg
12. 12 http://captology.stanford.edu/wp-content/uploads/2014/03/MIP_Fogg_Stanford.pdf
13. 13 https://en.wikipedia.org/wiki/Persuasion
14. 14 http://captology.stanford.edu/wp-content/uploads/2014/03/MIP_Fogg_Stanford.pdf
15. 15 http://www.analyzewords.com/index.php
16. 16 https://www.forbes.com/sites/markrogowsky/2016/11/17/facebook-with-great-power-comes-great-responsibility/
17. 17 http://captology.stanford.edu/wp-content/uploads/2014/03/MIP_Fogg_Stanford.pdf
18. 18 https://www.smashingmagazine.com/wp-content/uploads/2017/06/04-The-Surprising-Relationship-Between-Gamification-and-Modern-Persuasion-preview-opt.jpeg
19. 19 https://www.smashingmagazine.com/wp-content/uploads/2017/06/05-The-Surprising-Relationship-Between-Gamification-and-Modern-Persuasion-800w-opt.jpeg
20. 20 http://adsoftheworld.com/media/ambient/volkswagen_the_speed_camera_lottery
21. 21 https://www.smashingmagazine.com/wp-content/uploads/2017/06/06-The-Surprising-Relationship-Between-Gamification-and-Modern-Persuasion-800w-opt.png
22. 22 https://www.smashingmagazine.com/wp-content/uploads/2017/06/07-The-Surprising-Relationship-Between-Gamification-and-Modern-Persuasion-800w-opt.png
23. 23 https://www.fitwell.com.tr/
24. 24 https://www.smashingmagazine.com/wp-content/uploads/2017/06/08-The-Surprising-Relationship-Between-Gamification-and-Modern-Persuasion-800w-opt.png
25. 25 https://www.smashingmagazine.com/wp-content/uploads/2017/06/09-The-Surprising-Relationship-Between-Gamification-and-Modern-Persuasion-large-opt.jpg
26. 26 https://www.smashingmagazine.com/wp-content/uploads/2017/06/09-The-Surprising-Relationship-Between-Gamification-and-Modern-Persuasion-large-opt.jpg
27. 27 https://www.smashingmagazine.com/wp-content/uploads/2017/06/10-The-Surprising-Relationship-Between-Gamification-and-Modern-Persuasion-large-opt.jpg
28. 28 https://www.smashingmagazine.com/wp-content/uploads/2017/06/10-The-Surprising-Relationship-Between-Gamification-and-Modern-Persuasion-large-opt.jpg
29. 29 https://www.smashingmagazine.com/wp-content/uploads/2017/06/11-The-Surprising-Relationship-Between-Gamification-and-Modern-Persuasion-large-opt.jpeg
30. 30 https://www.smashingmagazine.com/wp-content/uploads/2017/06/11-The-Surprising-Relationship-Between-Gamification-and-Modern-Persuasion-large-opt.jpeg
31. 31 https://www.smashingmagazine.com/wp-content/uploads/2017/06/12-The-Surprising-Relationship-Between-Gamification-and-Modern-Persuasion-large-opt.jpeg
32. 32 https://www.smashingmagazine.com/wp-content/uploads/2017/06/12-The-Surprising-Relationship-Between-Gamification-and-Modern-Persuasion-large-opt.jpeg
33. 33 http://www.ou.edu/deptcomm/dodjcc/groups/99A2/theories.htm
34. 34 https://www.quora.com/Whats-the-usage-statistics-of-Google-Inbox/answer/Vijay-Umapathy?srid=ulkdt
35. 35 https://www.nirandfar.com/2013/02/new-video-hooked-the-psychology-of-how-products-engage-us.html
36. 36 https://www.smashingmagazine.com/wp-content/uploads/2017/06/13-The-Surprising-Relationship-Between-Gamification-and-Modern-Persuasion-800w-opt.png
37. 37 http://behaviormodel.org
38. 38 https://www.smashingmagazine.com/wp-content/uploads/2017/06/14-The-Surprising-Relationship-Between-Gamification-and-Modern-Persuasion-800w-opt.png
39. 39 https://www.smashingmagazine.com/wp-content/uploads/2017/06/15-The-Surprising-Relationship-Between-Gamification-and-Modern-Persuasion-800w-opt.png
40. 40 https://www.smashingmagazine.com/wp-content/uploads/2017/06/16-The-Surprising-Relationship-Between-Gamification-and-Modern-Persuasion-800w-opt.png
41. 41 https://www.smashingmagazine.com/wp-content/uploads/2017/06/17-The-Surprising-Relationship-Between-Gamification-and-Modern-Persuasion-800w-opt.png
42. 42 https://www.smashingmagazine.com/wp-content/uploads/2017/06/18-The-Surprising-Relationship-Between-Gamification-and-Modern-Persuasion-large-opt.png
43. 43 https://www.smashingmagazine.com/wp-content/uploads/2017/06/18-The-Surprising-Relationship-Between-Gamification-and-Modern-Persuasion-large-opt.png
44. 44 https://www.smashingmagazine.com/wp-content/uploads/2017/06/19-The-Surprising-Relationship-Between-Gamification-and-Modern-Persuasion-large-opt.png
45. 45 https://www.smashingmagazine.com/wp-content/uploads/2017/06/19-The-Surprising-Relationship-Between-Gamification-and-Modern-Persuasion-large-opt.png
46. 46 https://www.smashingmagazine.com/wp-content/uploads/2017/06/20-The-Surprising-Relationship-Between-Gamification-and-Modern-Persuasion-large-opt.png
47. 47 https://www.smashingmagazine.com/wp-content/uploads/2017/06/20-The-Surprising-Relationship-Between-Gamification-and-Modern-Persuasion-large-opt.png
48. 48 https://www.smashingmagazine.com/wp-content/uploads/2017/07/medium-stats-large-opt.png
49. 49 https://www.smashingmagazine.com/wp-content/uploads/2017/07/medium-stats-large-opt.png
50. 50 https://www.smashingmagazine.com/wp-content/uploads/2017/06/22-The-Surprising-Relationship-Between-Gamification-and-Modern-Persuasion-large-opt.png
51. 51 https://www.smashingmagazine.com/wp-content/uploads/2017/06/22-The-Surprising-Relationship-Between-Gamification-and-Modern-Persuasion-large-opt.png

↑ Back to topTweet itShare on Facebook

In its move to patch a security hole as part of the iOS 10.3 release, Apple has introduced (yet) another redirection mechanism that developers must handle when attempting to implement mobile deep-link routing (i.e. the mechanism to route users to a specific page inside a mobile app, rather than the App Store or app home page).

This redirection instance has introduced additional friction to the app download and reopening process, and data shows that it has decreased conversion rates on iOS 10.3. This post examines the issue in detail and discusses solutions to help developers fix it.

With iOS 10.3, Apple has gifted the world powerful new features², as well as fixes for critical security holes. For your typical iPhone user, it’s a really nice upgrade. For a software developer who is responsible for either a mobile website or a native app, it can be a huge pain.

Why? At some point in early 2017, a few enterprising scammers figured out how to hijack iOS Safari³ by abusing the custom URI scheme confirmation alert. This alert prevented user interaction until it was dismissed; so, the result of triggering it in an endless loop was essentially low-tech ransomware. Unfortunately, it was realistic enough to trick many users into paying up. In iOS 10.3, Apple fixed this security hole by changing the confirmation alert into a new non-blocking dialog. It looks like this:

From a user’s perspective, no big deal. For developers, there is a hidden change that has more important implications: the App Store had always received a special exemption from the old version of this alert, but that exemption has now been removed.

How Deep-Linking Is Supposed To Work Link

A basic deep-linking system for an app has two goals:

• If the app is installed, open it and take the user to the content requested.
• If the app is not installed, take the user somewhere else so they can download it.

Apple’s official deep-linking standard, “universal links,” is designed for the first case. It’s not perfect: Configuration is complicated, and there are many places (Facebook, Twitter and any app using SFSafariViewController, to name a few) where things don’t “just work.” But the user experience of deep-linking into an app is generally quite good once that app is installed. None of this has changed in iOS 10.3.

It’s the second case where iOS 10.3 makes things complicated. If a user doesn’t have your app installed, they have always ended up in Safari, looking at the web version of that link. You are then responsible for redirecting that user to download the app. Because Apple has not implemented universal links for the App Store, developers have had to rely on a custom URI scheme redirection. And a custom URI scheme redirect on iOS 10.3 now means an alert. Apple even does it this way itself: Just try visiting https://itunes.apple.com/us/app/airbnb/id401626263⁵ on an iOS 10.3 device, and you’ll run straight into the new confirmation dialog.

The App Store Redirection Issue On iOS 10.3 Link

Here’s the situation. When a user clicks any link that leads to the App Store, iOS 10.3 will display a modal asking the user whether they’d like to go there. We’ve tested Apple’s appsto.re short links, full App Store long links, links from attribution providers and deep-linking platforms, and our own Branch-hosted deep links. There is no way around this new alert.

Why is this bad? There are actually two problems:

• It’s an extra step.
  
  Users don’t like extra steps, especially because downloading a new app is already relatively high-friction. Adding another tap certainly doesn’t help.
• Users can press “Cancel.”
  
  This is the much bigger problem. Pressing “Cancel” can leave users trapped on an empty page in Safari. Even worse, if they’ve come from another app and then go back to click the same link again, it’ll show this error message and do nothing:

⁶

Fixing The iOS 10.3 Redirection Issue Link

You can’t avoid the alert. And the reality is that some users will click “Cancel,” either on purpose or by mistake. What you can do is give more context, to help visitors complete their journey if they fall off in the middle. I’m calling this a “second chance” screen, and it looks like this:

⁷

Yes, the new iOS 10.3 confirmation dialog is still there. But now we also have a friendly URL in Safari’s address bar, the app logo and name in the background, and a button that users can click to try again:

⁸

At Branch⁹, we pushed the first version of this second-chance screen live for all apps on the Branch platform within hours of discovering this new edge case in iOS 10.3. It has since become a widely adopted solution; here are just a few examples we have seen pop up in the last few weeks from various services:

¹⁰

Making the best of a bad situation, some apps have built custom second-chance screens:

¹¹

All of these screens are solving the same basic problem: give visitors an escape hatch if they accidentally hit that “Cancel” button. It is still less than ideal, but the result works:

¹²

A Basic Template Link

Here is the default template¹³ we use on the current second-chance screen for all of the apps on Branch’s platform:

The key part of this is the JavaScript snippet at the end:

<script type="text/javascript"> window.onload = function() { window.location = "<% iTunes Store URL %>"; }; </script>

The logic works like this:

1. When the page loads, attempt to forward to the App Store. (JavaScript redirections like this are fully supported by Google¹⁴ and have no adverse effect on SEO.)
2. The redirection presents the confirmation dialog to the user.
3. If the user taps “Open,” all is good.
4. If the user taps “Cancel,” the rest of the template will have rendered in the background.
5. The user has unlimited opportunities to tap your download button. This displays the confirmation dialog again, but hopefully the user is now ready to continue.

However, I wouldn’t personally recommend building this solution yourself; you have better things to do than to constantly fix new edge cases like these from Apple, Google, Facebook, etc. If you’re using a hosted deep-link provider such as Branch or Firebase (with its Dynamic Links), then this edge case is already being handled for you. Attribution tools such as Adjust and AppsFlyer have also built similar workarounds for their paid tracking links.

Impact On App Conversion Rate Link

We wanted to know how much this new confirmation alert actually affects download conversion rates. The Branch platform has millions of link clicks per day, across almost 25,000 apps, so we took a sample of this data from 2 May 2017. Here is what we found:

¹⁵

What does this actually mean? Let’s break it down

Visitors Who Click “Cancel” Link

Safari does not allow clicks on this new “Cancel” button to be tracked directly. However, Branch can infer the number based on changes to other metrics that we measure, further down the funnel. In our sample, almost 19% of users were clicking it.

Installations Recaptured By Second-Chance Screen Link

The good news is that visitors still want your app — they are just getting confused by this new warning. When we give them another opportunity to click by showing a content preview with a download button, over 5% of our sample continued to install successfully.

Why Apple Needs To Fix This Link

Here is the bottom line: This new confirmation dialog is enough of a roadblock that almost a fifth of iOS users press the “Cancel” button. Even with a workaround enabled, the iOS 10.3 installation rate in our sample was about 2.25% lower than on iOS 10.2. Data shows that a second-chance screen helps, but some users still fail to make it all the way through to download.

From a more technical perspective, serving up a screen like this requires returning an HTTP 200 response, serving a page of content and waiting for the client to execute Javascript. The costs of adding just 100 milliseconds in latency are well known¹⁶, and sophisticated deep-linking implementations have long since moved to the far more efficient 307 redirection to reduce this redirection delay. Apple’s new iOS 10.3 behavior has broken this option, forcing the ecosystem to fall back on a slower, outdated solution.

Patching the original ransomware-esque custom URI exploit was the right thing for Apple to do, but the App Store is unlike any other platform. It is a core part of the iOS infrastructure. Applying such a flawed UX to a critical platform component is a costly decision.

With the early iOS 11 betas showing no change to this behavior, it seems possible we are stuck with a confirmation alert for the long haul. This makes it even more critical for you to offer your app’s users a fallback option. In the competitive mobile app world, having such an easy way to increase your installations is unheard of and is absolutely worth the small amount of effort it takes.

(al)

Footnotes Link

1. 1 https://www.smashingmagazine.com/2015/10/keep-your-android-app-popular-after-launch/
2. 2 http://bgr.com/2017/03/27/ios-10-3-features-list-change-log-best-new-iphone-features/
3. 3 https://blog.lookout.com/blog/2017/03/27/mobile-safari-scareware/
4. 4 https://www.smashingmagazine.com/wp-content/uploads/2017/07/1-Safari-Modal-Open-App-Store-opt.png
5. 5 https://itunes.apple.com/us/app/airbnb/id401626263
6. 6 https://www.smashingmagazine.com/wp-content/uploads/2017/07/2-Safari-Modal-Error-Message-opt.png
7. 7 https://www.smashingmagazine.com/wp-content/uploads/2017/07/3-Second-Chance-opt.png
8. 8 https://www.smashingmagazine.com/wp-content/uploads/2017/07/4-Second-Chance-Better-opt.png
9. 9 https://branch.io
10. 10 https://www.smashingmagazine.com/wp-content/uploads/2017/07/5-second-screen-examples-opt.png
11. 11 https://www.smashingmagazine.com/wp-content/uploads/2017/07/6-second-screen-examples-better-opt.png
12. 12 https://www.smashingmagazine.com/wp-content/uploads/2017/07/7-user-flow-opt.gif
13. 13 https://drive.google.com/file/d/0B-oElmhS9yOGVmRjNnIzWFBZd3c/view?usp=sharing
14. 14 http://searchengineland.com/tested-googlebot-crawls-javascript-heres-learned-220157
15. 15 https://www.smashingmagazine.com/wp-content/uploads/2017/07/9-ios-10-3-Conversion-Rates-opt.png
16. 16 https://www.digitalrealty.com/blog/the-cost-of-latency/

↑ Back to topTweet itShare on Facebook

Component-based libraries or frameworks such as Vue have given us the wonderful ability to create reusable components¹ to be spread throughout their respective application, ensuring that they are consistent, and (hopefully) simplifying how they are used.

In particular, form inputs tend to have plenty of complexity that you’d want to hide in a component, such as custom designs², labels, validation, help messages, and making sure each of these pieces are in the correct order so that they render correctly.

On top of that though, Vue has a built-in directive called v-model that simulates 2-way binding by binding a value and capturing input events. If you’re going to build a custom input component, then you’ll definitely want to support the v-model directive.

Sadly, when I looked around for examples of custom inputs in Vue for radio buttons or checkboxes, they either didn’t take v-model into consideration at all, or they failed to implement it correctly. There is some decent documentation for custom text inputs⁴, but since it doesn’t explain customizing radios or checkboxes, we’ll discuss that here.

This tutorial aims to help you…

1. Understand how v-model works on native inputs, focusing primarily on radios and checkboxes
2. Understand how v-model works on custom components by default
3. Learn how to create custom checkboxes and radios that emulate how v-model works on them natively

Quick note before we get started: ES2015+ code will be used throughout the code examples. I’ll also be favoring the Single File Component⁵ syntax over using Vue.component or new Vue.

How Does v-model Work Normally? Link

The official Vue documentation⁶ is actually pretty good on this topic, but there are a few minor blind spots. In any case, we’ll be trying to cover it pretty thoroughly here.

In essence, v-model is just a shorthand directive that gives us 2-way data binding, and the code it is shorthand for depends on what type of input it is being used on.

Text Boxes Link

<input v-model="message" placeholder="edit me"> <p>Message: {{ message }}</p> <!-- OR --> <p>message:</p> <p>{{ message }}</p> <textarea v-model="message" placeholder="add multiple lines"></textarea> 

When using a text input (including types such as email, number, etc.) or textarea, v-model="varName" is equivalent to :value="varName" @input="e => varName = e.target.value". This means that the value of the input is set to varName after each update to the input varName is updated to the value of the input. A normal select element will act like this too, though a multiple select will be different.

Radio Buttons Link

So, what about radio buttons?

<input type="radio" value="One" v-model="picked"> <input type="radio" value="Two" v-model="picked"> <span>Picked: {{ picked }}</span> 

This is equivalent to:

<input type="radio" value="One" :checked="picked == 'One'" @change="e => picked = e.target.value"> <input type="radio" value="Two" :checked="picked == 'Two'" @change="e => picked = e.target.value"> <span>Picked: {{ picked }}</span> 

Note how v-model isn’t even touching value anymore. It’s still doing the same thing in the change event handler (though it was changed to change instead of input), but now it’s determining whether checked should be true or false depending on whether picked is the same as the value of that radio button.

Checkboxes Link

Checkboxes are a bit more difficult to talk about because they have two different behaviors depending on whether there is only a single checkbox with a given v-model or multiple.

If you are using a single checkbox, v-model will treat it like a boolean and ignore the value.

<input type="checkbox" value="foo" v-model="isChecked"> 

is the same as…

<input type="checkbox" value="foo" :checked="!!isChecked" @change="e => isChecked = e.target.checked"> 

If you want it to be something other than true and false, you can use the true-value and false-value attribute, which control what values your model will be set to when the checkbox is checked or not.

<input type="checkbox" value="foo" v-model="isChecked" true-value="1" false-value="0"> 

is the same as…

<input type="checkbox" value="foo" :checked="isChecked == '1'" @change="e => isChecked = e.target.checked ? '1' : '0'"> 

That’s pretty much it for single-checkbox examples. If you have multiple checkboxes that share a model, then those checkboxes will fill an array with values of all the checkboxes that are checked, but make sure the model that you pass in is already an array or you’ll get some odd behavior. Also, the true-value and false-value attributes no longer affect anything.

<template> <div> <input type="checkbox" value="foo" v-model="checkedVals"> <input type="checkbox" value="bar" v-model="checkedVals"> <input type="checkbox" value="baz" v-model="checkedVals"> </div> </template> <script> export default { data: () => ({ checkedVals: ['bar'] }) } </script> 

The equivalent is a bit more difficult to keep inside the template, so I’ll move some of the logic to methods on the component:

<template> <div> <input type="checkbox" value="foo" v-model="checkedVals"> <input type="checkbox" value="bar" v-model="checkedVals"> <input type="checkbox" value="baz" v-model="checkedVals"> </div> </template> <script> export default { data() { return { checkedVals: ['bar'] } }, methods: { shouldBeChecked(val) { return this.checkedVals.includes(val) }, updateVals(e) { let isChecked = e.target.checked let val = e.target.value if (isChecked) { this.checkedVals.push(val) } else { this.checkVals.splice(this.checkedVals.indexOf(val), 1) } } } } </script> 

That’s a lot more complicated than what we’ve seen before, but if you break it down, it’s not too bad. shouldBeChecked is true when that checkbox’s value is included in the array and false if it isn’t. updateVals adds the checkbox’s value to the array when it gets checked and removes it when it gets unchecked.

How Does v-model Work On Components? Link

Since Vue doesn’t know how your component is supposed to work, or if it’s trying to act as a replacement for a certain type of input, it treats all components the same with regards to v-model. It actually works the exact same way as it does for text inputs, except that in the event handler, it doesn’t expect an event object to be passed to it, rather it expects the value to be passed straight to it. So…

<my-custom-component v-model="myProperty" /> 

…is the same thing as…

<my-custom-component :value="myProperty" @input="val => myProperty = val" /> 

A component can change this to a small extent using the model property:

export default { name: 'my-custom-component', model: { prop: 'foo', event: 'bar' }, // ... } 

v-model will look at these properties and instead of using the value attribute, it’ll use the attribute you specify in prop and instead of listening for the input event, it’ll use the event you specified in event. So the above my-custom-component example would actually expand out to the following:

<my-custom-component :foo="myProperty" @bar="val => myProperty = val" /> 

This is nice, but if we’re making a custom radio or checkbox, this doesn’t work very well. With some work, though, we can move the logic that v-model uses on radios and checkboxes inside our custom components.

Supporting v-model On Custom Radios Link

Compared to a checkbox, custom radios are quite simple. Here’s a very basic custom radio that I build that just wraps the input in a label and accepts a label property to add the label text.

<template> <label> <input type="radio" :checked="shouldBeChecked" :value="value" @change="updateInput"> {{ label }} </label> </template> <script> export default { model: { prop: 'modelValue', event: 'change' }, props: { value: { type: String, }, modelValue: { default: "" }, label: { type: String, required: true }, }, computed: { shouldBeChecked() { return this.modelValue == this.value } } methods: { updateInput() { this.$emit('change', this.value) } } } </script> 

Note: I only included props that are helpful for explaining how these should work with v-model, but input tags can take advantage of several other attributes (such as name or disabled), so make sure you create all of the props you’ll need and pass them on to input. You’ll also want to consider accessibility by adding WAI-ARIA attributes⁷, as well as using slots⁸ for adding content rather than props like I did here with label.

You may think that since I didn’t include name in this example, a group of radios wouldn’t actually sync up with one another. Actually the updating of the model will in turn update the other radio buttons that share that model, so they don’t need to share a name like they do in plain HTML forms as long as they share the same model.

Supporting v-model On Custom Checkboxes Link

Making custom checkboxes is noticeably more complex than the radio buttons, primarily because we have to support two different use cases: a single true/false checkbox (that may or may not use true-value and/or false-value) and multiple checkboxes that combine all the checked values into an array.

So how do we determine which use case it is? You might think that we need to determine if there are other checkboxes with the same name attribute, but that’s not actually what Vue’s built-in system uses. Just like the radios, Vue doesn’t take the name attribute into consideration at all. That’s only used when natively submitting a form. So then you might think it determines it based on whether there are other checkboxes that share the same model, but that’s not it either. It’s determined by whether or not the model is an array. That’s it.

So the code will be structured similarly to the custom radio button’s code, but inside shouldBeChecked and updateInput the logic will split depending on whether or not modelValue is an array.

<template> <label> <input type="checkbox" :checked="shouldBeChecked" :value="value" @change="updateInput"> {{ label }} </label> </template> <script> export default { model: { prop: 'modelValue', event: 'change' }, props: { value: { type: String, }, modelValue: { default: false }, label: { type: String, required: true }, // We set `true-value` and `false-value` to the default true and false so // we can always use them instead of checking whether or not they are set. // Also can use camelCase here, but hyphen-separating the attribute name // when using the component will still work trueValue: { default: true }, falseValue: { default: false } }, computed: { shouldBeChecked() { if (this.modelValue instanceof Array) { return this.modelValue.includes(this.value) } // Note that `true-value` and `false-value` are camelCase in the JS return this.modelValue === this.trueValue } }, methods: { updateInput(event) { let isChecked = event.target.checked if (this.modelValue instanceof Array) { let newValue = [...this.modelValue] if (isChecked) { newValue.push(this.value) } else { newValue.splice(newValue.indexOf(this.value), 1) } this.$emit('change', newValue) } else { this.$emit('change', isChecked ? this.trueValue : this.falseValue) } } } } </script> 

And there you have it. It may be better, though, to split this into two different components: one for handling the single true/false toggle and one for use in lists of options. That would allow it to more closely follow the Single-Responsibility Principle, but if you’re looking for a drop-in replacement to checkboxes, this is what you’re looking for (plus the addition of all the other useful attributes and custom features you might want).

Further Reading Link

There’s plenty more to learn about Custom Inputs, Vue Components, and Vue in general. I recommend giving some of these resources a look-through.

• Awesome-Vue’s Component Sets⁹ – Awesome-Vue is a huge list of Vue-related projects and resources, so feel free to peruse anything and everything on that list, but in particular I want to point out the UI Libraries and Component Sets because they pretty much all have examples of Checkboxes and Radios you can look at if you feel like diving into their source code.
• Vue Curated¹⁰ – This is a list similar to Awesome-Vue, but is more strictly curated so you know that everything on the list is worth taking a look at.
• Vue Component Guide¹¹ – The official Vue guide is a great place to learn the basics about anything related to Vue.
• Vue API Documentation¹² – This documentation is where you get into the really deep details of Vue.

(rb, vf, al, il)

Footnotes Link

1. 1 https://www.smashingmagazine.com/2016/02/writing-next-generation-reusable-javascript-modules/
2. 2 https://codepen.io/AngelaVelasquez/pen/Eypnq
3. 3 https://www.smashingmagazine.com/2016/02/writing-next-generation-reusable-javascript-modules/
4. 4 https://vuejs.org/v2/guide/components.html#Form-Input-Components-using-Custom-Events
5. 5 https://vuejs.org/v2/guide/single-file-components.html
6. 6 https://vuejs.org/v2/guide/forms.html
7. 7 https://www.w3.org/WAI/intro/aria
8. 8 https://vuejs.org/v2/guide/components.html#Content-Distribution-with-Slots
9. 9 https://github.com/vuejs/awesome-vue#frameworks
10. 10 https://curated.vuejs.org/
11. 11 https://vuejs.org/v2/guide/
12. 12 https://vuejs.org/v2/api/

↑ Back to topTweet itShare on Facebook

Could there be a better way to welcome the new month as with a tidy desktop and a fresh wallpaper? Well, we’ve got you covered. To help you start into August freshly inspired, artists and designers from across the globe once again¹ challenged their artistic skills to create unique desktop wallpapers for you to indulge in — wallpapers that are a bit more distinctive as the usual crowd.

All wallpapers in this collection can be downloaded for free and come in versions with and without a calendar — to keep your deadlines always in sight or to stick to your favorite wallpaper even after the month has ended. A big thank-you to everyone who shared their artworks with us! Now it’s up to you to decide which one will become your August companion.

Please note that:

• All images can be clicked on and lead to the preview of the wallpaper,
• You can feature your work in our magazine² by taking part in our Desktop Wallpaper Calendars series. We are regularly looking for creative designers and artists to be featured on Smashing Magazine. Are you one of them?

Further Reading on SmashingMag: Link

• Create a Cute Little Tiger in Illustrator³
• How To Draw A Cartoon In Illustrator⁴
• Challenge Yourself More Often By Creating Artwork Every Day⁵
• Calligraphy Art: Getting Started And Lessons Learned⁶

Happiness Happens In August

“Many people find August one of the happiest months of the year because of holidays. You can spend days sunbathing, swimming, birdwatching, listening to their joyful chirping, and indulging in sheer summer bliss. August 8th is also known as the Happiness Happens Day, so make it worthwhile.” — Designed by PopArt Studio⁷ from Serbia.

• preview⁹
• with calendar: 320×480¹⁰, 640×480¹¹, 800×480¹², 800×600¹³, 1024×768¹⁴, 1024×1024¹⁵, 1152×864¹⁶, 1280×720¹⁷, 1280×800¹⁸, 1280×960¹⁹, 1280×1024²⁰, 1366×768²¹, 1400×1050²², 1440×900²³, 1600×1200²⁴, 1680×1050²⁵, 1680×1200²⁶, 1920×1080²⁷, 1920×1200²⁸, 1920×1440²⁹, 2560×1440³⁰
• without calendar: 320×480³¹, 640×480³², 800×480³³, 800×600³⁴, 1024×768³⁵, 1024×1024³⁶, 1152×864³⁷, 1280×720³⁸, 1280×800³⁹, 1280×960⁴⁰, 1280×1024⁴¹, 1366×768⁴², 1400×1050⁴³, 1440×900⁴⁴, 1600×1200⁴⁵, 1680×1050⁴⁶, 1680×1200⁴⁷, 1920×1080⁴⁸, 1920×1200⁴⁹, 1920×1440⁵⁰, 2560×1440⁵¹

Unforgettable Summer Night

Designed by BootstrapDash⁵² from India.

⁵³

• preview⁵⁴
• with calendar: 320×480⁵⁵, 640×480⁵⁶, 800×480⁵⁷, 800×600⁵⁸, 1024×768⁵⁹, 1024×1024⁶⁰, 1152×864⁶¹, 1280×720⁶², 1280×800⁶³, 1280×960⁶⁴, 1280×1024⁶⁵, 1366×768⁶⁶, 1440×900⁶⁷, 1440×1050⁶⁸, 1600×1200⁶⁹, 1680×1050⁷⁰, 1680×1200⁷¹, 1920×1080⁷², 1920×1200⁷³, 1920×1440⁷⁴, 2560×1440⁷⁵
• without calendar: 320×480⁷⁶, 640×480⁷⁷, 800×480⁷⁸, 800×600⁷⁹, 1024×768⁸⁰, 1024×1024⁸¹, 1152×864⁸², 1280×720⁸³, 1280×800⁸⁴, 1280×960⁸⁵, 1280×1024⁸⁶, 1366×768⁸⁷, 1440×900⁸⁸, 1440×1050⁸⁹, 1600×1200⁹⁰, 1680×1050⁹¹, 1680×1200⁹², 1920×1080⁹³, 1920×1200⁹⁴, 1920×1440⁹⁵, 2560×1440⁹⁶

Traveler In Time

“During bright summer days, while wandering around unfamiliar places, it is finally forgotten that one of the biggest human inventions is time itself, future becomes the past, past becomes the present and there are no earthly boundaries, just air.” — Designed by Ana Masnikosa⁹⁷ from Belgrade, Serbia.

⁹⁸

• preview⁹⁹
• with calendar: 320×480¹⁰⁰, 640×480¹⁰¹, 800×480¹⁰², 800×600¹⁰³, 1024×768¹⁰⁴, 1024×1024¹⁰⁵, 1152×864¹⁰⁶, 1280×720¹⁰⁷, 1280×800¹⁰⁸, 1280×960¹⁰⁹, 1280×1024¹¹⁰, 1400×1050¹¹¹, 1440×900¹¹², 1600×1200¹¹³, 1680×1050¹¹⁴, 1680×1200¹¹⁵, 1920×1080¹¹⁶, 1920×1200¹¹⁷, 1920×1440¹¹⁸, 2560×1440¹¹⁹
• without calendar: 320×480¹²⁰, 640×480¹²¹, 800×480¹²², 800×600¹²³, 1024×768¹²⁴, 1024×1024¹²⁵, 1152×864¹²⁶, 1280×720¹²⁷, 1280×800¹²⁸, 1280×960¹²⁹, 1280×1024¹³⁰, 1400×1050¹³¹, 1440×900¹³², 1600×1200¹³³, 1680×1050¹³⁴, 1680×1200¹³⁵, 1920×1080¹³⁶, 1920×1200¹³⁷, 1920×1440¹³⁸, 2560×1440¹³⁹

Are You Ready For The Adventure?

Designed by UrbanUI¹⁴⁰ from India.

¹⁴¹

• preview¹⁴²
• with calendar: 320×480¹⁴³, 640×480¹⁴⁴, 800×480¹⁴⁵, 800×600¹⁴⁶, 1024×768¹⁴⁷, 1024×1024¹⁴⁸, 1152×864¹⁴⁹, 1280×720¹⁵⁰, 1280×800¹⁵¹, 1280×960¹⁵², 1280×1024¹⁵³, 1366×768¹⁵⁴, 1440×900¹⁵⁵, 1440×1050¹⁵⁶, 1600×1200¹⁵⁷, 1680×1050¹⁵⁸, 1680×1200¹⁵⁹, 1920×1080¹⁶⁰, 1920×1440¹⁶¹
• without calendar: 320×480¹⁶², 640×480¹⁶³, 800×480¹⁶⁴, 800×600¹⁶⁵, 1024×768¹⁶⁶, 1024×1024¹⁶⁷, 1152×864¹⁶⁸, 1280×720¹⁶⁹, 1280×800¹⁷⁰, 1280×960¹⁷¹, 1280×1024¹⁷², 1366×768¹⁷³, 1440×900¹⁷⁴, 1440×1050¹⁷⁵, 1600×1200¹⁷⁶, 1680×1050¹⁷⁷, 1680×1200¹⁷⁸, 1920×1080¹⁷⁹, 1920×1440¹⁸⁰

I Love Summer

“I love the summer nights and the sounds of the sea, the crickets, the music of some nice party.” — Designed by Maria Karapaunova¹⁸¹ from Bulgaria.

¹⁸²

• preview¹⁸³
• with calendar: 320×480¹⁸⁴, 640×480¹⁸⁵, 800×480¹⁸⁶, 800×600¹⁸⁷, 1024×768¹⁸⁸, 1024×1024¹⁸⁹, 1152×864¹⁹⁰, 1280×720¹⁹¹, 1280×800¹⁹², 1280×960¹⁹³, 1280×1024¹⁹⁴, 1366×768¹⁹⁵, 1440×900¹⁹⁶, 1440×1050¹⁹⁷, 1600×1200¹⁹⁸, 1680×1050¹⁹⁹, 1680×1200²⁰⁰, 1920×1080²⁰¹, 1920×1200²⁰², 1920×1440²⁰³, 2560×1440²⁰⁴
• without calendar: 320×480²⁰⁵, 640×480²⁰⁶, 800×480²⁰⁷, 800×600²⁰⁸, 1024×768²⁰⁹, 1024×1024²¹⁰, 1152×864²¹¹, 1280×720²¹², 1280×800²¹³, 1280×960²¹⁴, 1280×1024²¹⁵, 1366×768²¹⁶, 1440×900²¹⁷, 1440×1050²¹⁸, 1600×1200²¹⁹, 1680×1050²²⁰, 1680×1200²²¹, 1920×1080²²², 1920×1200²²³, 1920×1440²²⁴, 2560×1440²²⁵

Melon Day

“Melon Day (second Sunday in August) is an annual national holiday in Turkmenistan devoted to festivities to celebrate the country’s muskmelon. Another reason for me to create this wallpaper is that melons are just awesome!” — Designed by Melissa Bogemans²²⁶ from Belgium.

²²⁷

• preview²²⁸
• with calendar: 320×480²²⁹, 640×480²³⁰, 800×480²³¹, 800×600²³², 1024×768²³³, 1024×1024²³⁴, 1152×864²³⁵, 1280×720²³⁶, 1280×800²³⁷, 1280×960²³⁸, 1280×1024²³⁹, 1400×1050²⁴⁰, 1440×900²⁴¹, 1600×1200²⁴², 1680×1050²⁴³, 1680×1200²⁴⁴, 1920×1080²⁴⁵, 1920×1200²⁴⁶, 1920×1440²⁴⁷, 2560×1440²⁴⁸
• without calendar: 320×480²⁴⁹, 640×480²⁵⁰, 800×480²⁵¹, 800×600²⁵², 1024×768²⁵³, 1024×1024²⁵⁴, 1152×864²⁵⁵, 1280×720²⁵⁶, 1280×800²⁵⁷, 1280×960²⁵⁸, 1280×1024²⁵⁹, 1400×1050²⁶⁰, 1440×900²⁶¹, 1600×1200²⁶², 1680×1050²⁶³, 1680×1200²⁶⁴, 1920×1080²⁶⁵, 1920×1200²⁶⁶, 1920×1440²⁶⁷, 2560×1440²⁶⁸

Time To Surf!

“The best rides of our lives come along only once in a while. Don’t wait for it. Sometimes you just have to ride the wave you’re given!” — Designed by PlusCharts²⁶⁹ from India.

²⁷⁰

• preview²⁷¹
• with calendar: 320×480²⁷², 640×480²⁷³, 800×480²⁷⁴, 800×600²⁷⁵, 1024×768²⁷⁶, 1024×1024²⁷⁷, 1152×864²⁷⁸, 1280×720²⁷⁹, 1280×800²⁸⁰, 1280×960²⁸¹, 1280×1024²⁸², 1366×768²⁸³, 1440×900²⁸⁴, 1440×1050²⁸⁵, 1600×1200²⁸⁶, 1680×1050²⁸⁷, 1680×1200²⁸⁸, 1920×1080²⁸⁹, 1920×1200²⁹⁰, 1920×1440²⁹¹, 2560×1440²⁹²
• without calendar: 320×480²⁹³, 640×480²⁹⁴, 800×480²⁹⁵, 800×600²⁹⁶, 1024×768²⁹⁷, 1024×1024²⁹⁸, 1152×864²⁹⁹, 1280×720³⁰⁰, 1280×800³⁰¹, 1280×960³⁰², 1280×1024³⁰³, 1366×768³⁰⁴, 1440×900³⁰⁵, 1440×1050³⁰⁶, 1600×1200³⁰⁷, 1680×1050³⁰⁸, 1680×1200³⁰⁹, 1920×1080³¹⁰, 1920×1200³¹¹, 1920×1440³¹², 2560×1440³¹³

La Tomatina Festival

“La Tomatina is a food fight festival held on the last Wednesday of August each year in the town of Bunol near Valencia in Spain. Thousands and thousands of people come from all corners of the world to participate in La Tomatina, which is known as the ‘biggest food fight’, where more than one hundred metric tons of over-ripe tomatoes are thrown on each other in the streets.” — Designed by Suman Sil³¹⁴ from India.

³¹⁵

• preview³¹⁶
• with calendar: 1280×720³¹⁷, 1280×800³¹⁸, 1280×960³¹⁹, 1280×1024³²⁰, 1366×768³²¹, 1400×1050³²², 1440×900³²³, 1600×1200³²⁴, 1680×1050³²⁵, 1680×1200³²⁶, 1920×1080³²⁷, 1920×1200³²⁸, 1920×1440³²⁹, 2560×1440³³⁰
• without calendar: 1280×720³³¹, 1280×800³³², 1280×960³³³, 1280×1024³³⁴, 1366×768³³⁵, 1400×1050³³⁶, 1440×900³³⁷, 1600×1200³³⁸, 1680×1050³³⁹, 1680×1200³⁴⁰, 1920×1080³⁴¹, 1920×1200³⁴², 1920×1440³⁴³, 2560×1440³⁴⁴

On The Road

“When I think of August I think of vacation. August is the last month of summer break in Belgium so that’s why I like travelling then to enjoy that last month. I like visiting countries where the weather is pretty hot and that’s why I decided to draw a wallpaper where you are basically on the road to the sun.” — Designed by Senne Mommens³⁴⁵ from Belgium.

³⁴⁶

• preview³⁴⁷
• with calendar: 320×480³⁴⁸, 1280×720³⁴⁹, 1280×800³⁵⁰, 1280×1024³⁵¹, 1920×1080³⁵², 2560×1440³⁵³
• without calendar: 320×480³⁵⁴, 1280×720³⁵⁵, 1280×800³⁵⁶, 1280×1024³⁵⁷, 1920×1080³⁵⁸, 2560×1440³⁵⁹

Hello Again

“In Melbourne it is the last month of quite a cool winter so we are looking forward to some warmer days to come.” — Designed by Tazi³⁶⁰ from Australia.

³⁶¹

• preview³⁶²
• with calendar: 320×480³⁶³, 640×480³⁶⁴, 800×600³⁶⁵, 1024×768³⁶⁶, 1152×864³⁶⁷, 1280×720³⁶⁸, 1280×960³⁶⁹, 1600×1200³⁷⁰, 1920×1080³⁷¹, 1920×1440³⁷², 2560×1440³⁷³
• without calendar: 320×480³⁷⁴, 640×480³⁷⁵, 800×600³⁷⁶, 1024×768³⁷⁷, 1152×864³⁷⁸, 1280×720³⁷⁹, 1280×960³⁸⁰, 1600×1200³⁸¹, 1920×1080³⁸², 1920×1440³⁸³, 2560×1440³⁸⁴

Let Us Save The Tigers

“Let us take a pledge to save these endangered species and create a world that is safe for them to live and perish just like all creatures.” — Designed by Acodez IT Solutions³⁸⁵ from India.

³⁸⁶

• preview³⁸⁷
• with calendar: 320×480³⁸⁸, 640×480³⁸⁹, 800×480³⁹⁰, 800×600³⁹¹, 1024×768³⁹², 1024×1024³⁹³, 1152×864³⁹⁴, 1280×720³⁹⁵, 1280×800³⁹⁶, 1280×960³⁹⁷, 1280×1024³⁹⁸, 1366×768³⁹⁹, 1400×1050⁴⁰⁰, 1440×900⁴⁰¹, 1600×1200⁴⁰², 1680×1050⁴⁰³, 1680×1200⁴⁰⁴, 1920×1080⁴⁰⁵, 1920×1200⁴⁰⁶, 1920×1440⁴⁰⁷, 2560×1440⁴⁰⁸
• without calendar: 320×480⁴⁰⁹, 640×480⁴¹⁰, 800×480⁴¹¹, 800×600⁴¹², 1024×768⁴¹³, 1024×1024⁴¹⁴, 1152×864⁴¹⁵, 1280×720⁴¹⁶, 1280×800⁴¹⁷, 1280×960⁴¹⁸, 1280×1024⁴¹⁹, 1366×768⁴²⁰, 1400×1050⁴²¹, 1440×900⁴²², 1600×1200⁴²³, 1680×1050⁴²⁴, 1680×1200⁴²⁵, 1920×1080⁴²⁶, 1920×1200⁴²⁷, 1920×1440⁴²⁸, 2560×1440⁴²⁹

Launch

“The warm, clear summer nights make me notice the stars more — that’s what inspired this space-themed design!” — Designed by James Mitchell⁴³⁰ from the United Kingdom.

⁴³¹

• preview⁴³²
• with calendar: 1280×720⁴³³, 1280×800⁴³⁴, 1366×768⁴³⁵, 1440×900⁴³⁶, 1680×1050⁴³⁷, 1920×1080⁴³⁸, 1920×1200⁴³⁹, 2560×1440⁴⁴⁰, 2880×1800⁴⁴¹
• without calendar: 1280×720⁴⁴², 1280×800⁴⁴³, 1366×768⁴⁴⁴, 1440×900⁴⁴⁵, 1680×1050⁴⁴⁶, 1920×1080⁴⁴⁷, 1920×1200⁴⁴⁸, 2560×1440⁴⁴⁹, 2880×1800⁴⁵⁰

Be Brave To Meet It In Your Style

“Moments in life comes with hiccups and hitches, and so it remains unpredictable all along. There are always things you must meet in your day to day life, being afraid or running backward won’t take those away from you. In a nutshell, it’s a box full of new challenges, new thrills, new problems and new solutions, and so what we are left with is our perspective to deal with it! Face each moment until it concludes to be your last, with valor, attitude and a sturdy charm. Meeting the situations are mandatory, the thing that counts is how you face it, be yourself!” — Designed by Sweans⁴⁵¹ from London.

⁴⁵²

• preview⁴⁵³
• with calendar: 320×480⁴⁵⁴, 640×480⁴⁵⁵, 800×480⁴⁵⁶, 800×600⁴⁵⁷, 1024×768⁴⁵⁸, 1024×1024⁴⁵⁹, 1152×864⁴⁶⁰, 1280×720⁴⁶¹, 1280×800⁴⁶², 1280×960⁴⁶³, 1280×1024⁴⁶⁴, 1366×768⁴⁶⁵, 1400×1050⁴⁶⁶, 1440×900⁴⁶⁷, 1600×1200⁴⁶⁸, 1680×1050⁴⁶⁹, 1680×1200⁴⁷⁰, 1920×1080⁴⁷¹, 1920×1200⁴⁷², 1920×1440⁴⁷³, 2560×1440⁴⁷⁴
• without calendar: 320×480⁴⁷⁵, 640×480⁴⁷⁶, 800×480⁴⁷⁷, 800×600⁴⁷⁸, 1024×768⁴⁷⁹, 1024×1024⁴⁸⁰, 1152×864⁴⁸¹, 1280×720⁴⁸², 1280×800⁴⁸³, 1280×960⁴⁸⁴, 1280×1024⁴⁸⁵, 1366×768⁴⁸⁶, 1400×1050⁴⁸⁷, 1440×900⁴⁸⁸, 1600×1200⁴⁸⁹, 1680×1050⁴⁹⁰, 1680×1200⁴⁹¹, 1920×1080⁴⁹², 1920×1200⁴⁹³, 1920×1440⁴⁹⁴, 2560×1440⁴⁹⁵

Where Words Fail, Pictures Come Into Action

“Photography is a way of feeling, of touching, of loving. What you have caught on film is captured forever. It remembers little things, long after you have forgotten everything. Applauding all the photographers who are capable of capturing what your eye cannot see on this World Photography Day.” — Designed by Areva Digital⁴⁹⁶ from India.

⁴⁹⁷

• preview⁴⁹⁸
• with calendar: 320×480⁴⁹⁹, 640×480⁵⁰⁰, 800×480⁵⁰¹, 800×600⁵⁰², 1024×768⁵⁰³, 1024×1024⁵⁰⁴, 1152×864⁵⁰⁵, 1280×720⁵⁰⁶, 1280×960⁵⁰⁷, 1280×1024⁵⁰⁸, 1366×768⁵⁰⁹, 1400×1050⁵¹⁰, 1440×900⁵¹¹, 1600×1200⁵¹², 1680×1050⁵¹³, 1920×1080⁵¹⁴, 1920×1200⁵¹⁵, 1920×1440⁵¹⁶, 2560×1440⁵¹⁷
• without calendar: 320×480⁵¹⁸, 640×480⁵¹⁹, 800×480⁵²⁰, 800×600⁵²¹, 1024×768⁵²², 1024×1024⁵²³, 1152×864⁵²⁴, 1280×720⁵²⁵, 1280×960⁵²⁶, 1280×1024⁵²⁷, 1366×768⁵²⁸, 1400×1050⁵²⁹, 1440×900⁵³⁰, 1600×1200⁵³¹, 1680×1050⁵³², 1920×1080⁵³³, 1920×1200⁵³⁴, 1920×1440⁵³⁵, 2560×1440⁵³⁶

Liqiu And Orange Daylily Season

“Liqiu signifies the beginning of autumn in East Asian cultures. After entering the Liqiu, the mountains in Eastern Taiwan’s East Rift Valley are covered in a sea of golden flowers, very beautiful. The production season for high-mountain daylilies is in August. Chihke Mountain, in Yuli Township, and Sixty-Stone Mountain, in Fuli Township, which are both located in Hualien County, are two of the country’s three high-mountain daylily production areas.” — Designed by Hong, Zi-Qing⁵³⁷ from Taiwan.

⁵³⁸

• preview⁵³⁹
• with calendar: 1024×768⁵⁴⁰, 1080×1920⁵⁴¹, 1280×720⁵⁴², 1280×960⁵⁴³, 1280×1024⁵⁴⁴, 1366×768⁵⁴⁵, 1920×1080⁵⁴⁶, 2560×1440⁵⁴⁷
• without calendar: 1024×768⁵⁴⁸, 1080×1920⁵⁴⁹, 1280×720⁵⁵⁰, 1280×960⁵⁵¹, 1280×1024⁵⁵², 1366×768⁵⁵³, 1920×1080⁵⁵⁴, 2560×1440⁵⁵⁵

Happy Janmashtami

“Janmashtami – day The Lord Krishna was born —, an important Hindu Festival which is celebrated worldwide. The idea was to create the Lord Krishna’s playing flute persona, in the minimalist design form.” — Designed by Damn Perfect⁵⁵⁶ from Jaipur, India.

⁵⁵⁷

• preview⁵⁵⁸
• with calendar: 320×480⁵⁵⁹, 640×480⁵⁶⁰, 800×480⁵⁶¹, 800×600⁵⁶², 1024×768⁵⁶³, 1024×1024⁵⁶⁴, 1152×864⁵⁶⁵, 1280×720⁵⁶⁶, 1280×800⁵⁶⁷, 1280×960⁵⁶⁸, 1280×1024⁵⁶⁹, 1366×768⁵⁷⁰, 1400×1050⁵⁷¹, 1440×900⁵⁷², 1600×1200⁵⁷³, 1680×1050⁵⁷⁴, 1680×1200⁵⁷⁵, 1920×1080⁵⁷⁶, 1920×1200⁵⁷⁷, 1920×1440⁵⁷⁸, 2560×1440⁵⁷⁹
• without calendar: 320×480⁵⁸⁰, 640×480⁵⁸¹, 800×480⁵⁸², 800×600⁵⁸³, 1024×768⁵⁸⁴, 1024×1024⁵⁸⁵, 1152×864⁵⁸⁶, 1280×720⁵⁸⁷, 1280×800⁵⁸⁸, 1280×960⁵⁸⁹, 1280×1024⁵⁹⁰, 1366×768⁵⁹¹, 1400×1050⁵⁹², 1440×900⁵⁹³, 1600×1200⁵⁹⁴, 1680×1050⁵⁹⁵, 1680×1200⁵⁹⁶, 1920×1080⁵⁹⁷, 1920×1200⁵⁹⁸, 1920×1440⁵⁹⁹, 2560×1440⁶⁰⁰

If A Mozzie Could Tell You a Story

“Buon giorno! (That’s ‘hello’ in Italian.) My name is Anopheles and yes, I’m a member of the much-feared Malaria Mafia. I’m sure you would have heard of us. I’ve something to tell you, lean closer… You know, every 30 seconds, a person dies from malaria and yes, we alone are responsible for that! No matter how long your clothing, no matter how secure your mosquito net, and no matter how high you climb, we will find you, suck your blood and cover your body in enormous, itchy welts! Wait a minute; you are going to celebrate the World Mosquito Day on August 20th? No worries, we will be there with you, as your beating heart!” — Designed by IPIX Technologies⁶⁰¹ from India.

⁶⁰²

• preview⁶⁰³
• with calendar: 320×480⁶⁰⁴, 640×480⁶⁰⁵, 800×600⁶⁰⁶, 1024×768⁶⁰⁷, 1024×1024⁶⁰⁸, 1152×864⁶⁰⁹, 1280×720⁶¹⁰, 1280×800⁶¹¹, 1280×960⁶¹², 1280×1024⁶¹³, 1366×768⁶¹⁴, 1440×1050⁶¹⁵, 1600×1200⁶¹⁶, 1680×1050⁶¹⁷, 1680×1200⁶¹⁸, 1920×1080⁶¹⁹, 1920×1200⁶²⁰, 1920×1440⁶²¹, 2560×1440⁶²²
• without calendar: 320×480⁶²³, 640×480⁶²⁴, 800×600⁶²⁵, 1024×768⁶²⁶, 1024×1024⁶²⁷, 1152×864⁶²⁸, 1280×720⁶²⁹, 1280×800⁶³⁰, 1280×960⁶³¹, 1280×1024⁶³², 1366×768⁶³³, 1440×1050⁶³⁴, 1600×1200⁶³⁵, 1680×1050⁶³⁶, 1680×1200⁶³⁷, 1920×1080⁶³⁸, 1920×1200⁶³⁹, 1920×1440⁶⁴⁰, 2560×1440⁶⁴¹

DC Is Melting… Stay Cool!

“Visitors to DC’s iconic Washington Monument in the sweltering August heat might wish it were a giant popsicle. For now, we’ll just imagine it that way. Here’s hoping everyone beats the heat!” — Designed by The Hannon Group⁶⁴² from Washington, DC.

⁶⁴³

• preview⁶⁴⁴
• with calendar: 320×480⁶⁴⁵, 640×480⁶⁴⁶, 800×600⁶⁴⁷, 1024×768⁶⁴⁸, 1280×960⁶⁴⁹, 1440×900⁶⁵⁰, 1600×1200⁶⁵¹, 1680×1050⁶⁵², 1680×1200⁶⁵³, 1920×1080⁶⁵⁴, 1920×1400⁶⁵⁵, 2560×1440⁶⁵⁶
• without calendar: 320×480⁶⁵⁷, 640×480⁶⁵⁸, 800×600⁶⁵⁹, 1024×768⁶⁶⁰, 1280×960⁶⁶¹, 1440×900⁶⁶², 1600×1200⁶⁶³, 1680×1050⁶⁶⁴, 1680×1200⁶⁶⁵, 1920×1080⁶⁶⁶, 1920×1400⁶⁶⁷, 2560×1440⁶⁶⁸

The Month Of Respect

“August is the month of respect. Give respect, Take respect!” — Designed by Alrais Labs⁶⁶⁹ from Dubai.

⁶⁷⁰

• preview⁶⁷¹
• with calendar: 320×480⁶⁷², 640×480⁶⁷³, 800×480⁶⁷⁴, 800×600⁶⁷⁵, 1024×768⁶⁷⁶, 1024×1024⁶⁷⁷, 1152×864⁶⁷⁸, 1280×720⁶⁷⁹, 1280×800⁶⁸⁰, 1280×960⁶⁸¹, 1280×1024⁶⁸², 1366×768⁶⁸³, 1440×900⁶⁸⁴, 1440×1050⁶⁸⁵, 1600×1200⁶⁸⁶, 1680×1050⁶⁸⁷, 1680×1200⁶⁸⁸, 1920×1080⁶⁸⁹, 1920×1200⁶⁹⁰, 1920×1440⁶⁹¹, 2560×1440⁶⁹²
• without calendar: 320×480⁶⁹³, 640×480⁶⁹⁴, 800×480⁶⁹⁵, 800×600⁶⁹⁶, 1024×768⁶⁹⁷, 1024×1024⁶⁹⁸, 1152×864⁶⁹⁹, 1280×720⁷⁰⁰, 1280×800⁷⁰¹, 1280×960⁷⁰², 1280×1024⁷⁰³, 1366×768⁷⁰⁴, 1440×900⁷⁰⁵, 1440×1050⁷⁰⁶, 1600×1200⁷⁰⁷, 1680×1050⁷⁰⁸, 1680×1200⁷⁰⁹, 1920×1080⁷¹⁰, 1920×1200⁷¹¹, 1920×1440⁷¹², 2560×1440⁷¹³

Let Success Make The Noise

Designed by Metrovista⁷¹⁴ from Orlando, FL.

⁷¹⁵

• preview⁷¹⁶
• with calendar: 640×480⁷¹⁷, 800×600⁷¹⁸, 1024×768⁷¹⁹, 1152×864⁷²⁰, 1280×720⁷²¹, 1280×960⁷²², 1366×768⁷²³, 1400×1050⁷²⁴, 1600×1200⁷²⁵, 1920×1080⁷²⁶, 1920×1440⁷²⁷, 2560×1440⁷²⁸
• without calendar: 640×480⁷²⁹, 800×600⁷³⁰, 1024×768⁷³¹, 1152×864⁷³², 1280×720⁷³³, 1280×960⁷³⁴, 1366×768⁷³⁵, 1400×1050⁷³⁶, 1600×1200⁷³⁷, 1920×1080⁷³⁸, 1920×1440⁷³⁹, 2560×1440⁷⁴⁰

Play Together!

“In a world that get’s more divided each day, it is really important to understand that even if we are different we could all play together and have fun.” — Designed by Maria Keller⁷⁴¹ from Mexico.

⁷⁴²

• preview⁷⁴³
• with calendar: 320×480⁷⁴⁴, 640×480⁷⁴⁵, 640×1136⁷⁴⁶, 750×1334⁷⁴⁷, 800×480⁷⁴⁸, 800×600⁷⁴⁹, 1024×768⁷⁵⁰, 1024×1024⁷⁵¹, 1152×864⁷⁵², 1242×2208⁷⁵³, 1280×720⁷⁵⁴, 1280×800⁷⁵⁵, 1280×960⁷⁵⁶, 1280×1024⁷⁵⁷, 1366×768⁷⁵⁸, 1400×1050⁷⁵⁹, 1440×900⁷⁶⁰, 1600×1200⁷⁶¹, 1680×1050⁷⁶², 1680×1200⁷⁶³, 1920×1080⁷⁶⁴, 1920×1200⁷⁶⁵, 1920×1440⁷⁶⁶, 2560×1440⁷⁶⁷, 2880×1800⁷⁶⁸
• without calendar: 320×480⁷⁶⁹, 640×480⁷⁷⁰, 640×1136⁷⁷¹, 750×1334⁷⁷², 800×480⁷⁷³, 800×600⁷⁷⁴, 1024×768⁷⁷⁵, 1024×1024⁷⁷⁶, 1152×864⁷⁷⁷, 1242×2208⁷⁷⁸, 1280×720⁷⁷⁹, 1280×800⁷⁸⁰, 1280×960⁷⁸¹, 1280×1024⁷⁸², 1366×768⁷⁸³, 1400×1050⁷⁸⁴, 1440×900⁷⁸⁵, 1600×1200⁷⁸⁶, 1680×1050⁷⁸⁷, 1680×1200⁷⁸⁸, 1920×1080⁷⁸⁹, 1920×1200⁷⁹⁰, 1920×1440⁷⁹¹, 2560×1440⁷⁹², 2880×1800⁷⁹³

Colorful Summer

“Some colors are energetic, while others are much more calming and relaxing by nature. This summer, add some color to your life!” — Designed by StarAdmin Free Bootstrap Admin Template⁷⁹⁴ from India.

⁷⁹⁵

• preview⁷⁹⁶
• with calendar: 360×640⁷⁹⁷, 1024×768⁷⁹⁸, 1280×720⁷⁹⁹, 1280×800⁸⁰⁰, 1280×960⁸⁰¹, 1280×1024⁸⁰², 1366×768⁸⁰³, 1400×1050⁸⁰⁴, 1440×900⁸⁰⁵, 1600×900⁸⁰⁶, 1680×1200⁸⁰⁷, 1920×1080⁸⁰⁸
• without calendar: 360×640⁸⁰⁹, 1024×768⁸¹⁰, 1280×720⁸¹¹, 1280×800⁸¹², 1280×960⁸¹³, 1280×1024⁸¹⁴, 1366×768⁸¹⁵, 1400×1050⁸¹⁶, 1440×900⁸¹⁷, 1600×900⁸¹⁸, 1680×1200⁸¹⁹, 1920×1080⁸²⁰

Happy Birthday Edith!

“One of my favourite books, ‘The Railway Children’, inspired me to create this wallpaper. August the 15th marks the birthday of E. Nesbit who wrote this brilliant classic! I even included an inspirational quote from the book.” — Designed by Safia Begum⁸²¹ from the United Kingdom.

⁸²²

• preview⁸²³
• with calendar: 800×450⁸²⁴, 1280×720⁸²⁵, 1366×768⁸²⁶, 1440×810⁸²⁷, 1600×900⁸²⁸, 1680×945⁸²⁹, 1920×1080⁸³⁰, 2560×1440⁸³¹
• without calendar: 800×450⁸³², 1280×720⁸³³, 1366×768⁸³⁴, 1440×810⁸³⁵, 1600×900⁸³⁶, 1680×945⁸³⁷, 1920×1080⁸³⁸, 2560×1440⁸³⁹

Back To Work

“This will be my final semester of grad school, and the last time August will mean back to school for me.” — Designed by Caitey Kennedy⁸⁴⁰ from the United States.

⁸⁴¹

• preview⁸⁴²
• with calendar: 320×480⁸⁴³, 800×600⁸⁴⁴, 1024×768⁸⁴⁵, 1280×720⁸⁴⁶, 1280×1024⁸⁴⁷, 1400×1050⁸⁴⁸, 1680×1050⁸⁴⁹, 1920×1080⁸⁵⁰, 1920×1440⁸⁵¹, 2560×1440⁸⁵²
• without calendar: 320×480⁸⁵³, 800×600⁸⁵⁴, 1024×768⁸⁵⁵, 1280×720⁸⁵⁶, 1280×1024⁸⁵⁷, 1400×1050⁸⁵⁸, 1680×1050⁸⁵⁹, 1920×1080⁸⁶⁰, 1920×1440⁸⁶¹, 2560×1440⁸⁶²

Join In Next Month! Link

Please note that we respect and carefully consider the ideas and motivation behind each and every artist’s work. This is why we give all artists the full freedom to explore their creativity and express emotions and experience throughout their works. This is also why the themes of the wallpapers weren’t anyhow influenced by us, but rather designed from scratch by the artists themselves.

A big thank you to all designers for their participation. Join in next month⁸⁶³!

What’s Your Favorite? Link

What’s your favorite theme or wallpaper for this month? Please let us know in the comment section below.

Footnotes Link

1. 1 https://www.smashingmagazine.com/tag/wallpapers/
2. 2 https://www.smashingmagazine.com/desktop-wallpaper-calendars-join-in/
3. 3 https://www.smashingmagazine.com/2010/01/create-a-cute-little-tiger-in-illustrator/
4. 4 https://www.smashingmagazine.com/2016/03/drawing-a-cartoon-in-illustrator/
5. 5 https://www.smashingmagazine.com/2017/07/challenge-yourself-more-often/
6. 6 https://www.smashingmagazine.com/2017/02/art-calligraphy-getting-started-lessons-learned/
7. 7 https://www.popwebdesign.net/index_eng.html
8. 8 http://files.smashingmagazine.com/wallpapers/aug-17/happiness-happens-in-august/aug-17-happiness-happens-in-august-full.jpg
9. 9 http://files.smashingmagazine.com/wallpapers/aug-17/happiness-happens-in-august/aug-17-happiness-happens-in-august-preview.jpg
10. 10 http://files.smashingmagazine.com/wallpapers/aug-17/happiness-happens-in-august/cal/aug-17-happiness-happens-in-august-cal-320×480.jpg
11. 11 http://files.smashingmagazine.com/wallpapers/aug-17/happiness-happens-in-august/cal/aug-17-happiness-happens-in-august-cal-640×480.jpg
12. 12 http://files.smashingmagazine.com/wallpapers/aug-17/happiness-happens-in-august/cal/aug-17-happiness-happens-in-august-cal-800×480.jpg
13. 13 http://files.smashingmagazine.com/wallpapers/aug-17/happiness-happens-in-august/cal/aug-17-happiness-happens-in-august-cal-800×600.jpg
14. 14 http://files.smashingmagazine.com/wallpapers/aug-17/happiness-happens-in-august/cal/aug-17-happiness-happens-in-august-cal-1024×768.jpg
15. 15 http://files.smashingmagazine.com/wallpapers/aug-17/happiness-happens-in-august/cal/aug-17-happiness-happens-in-august-cal-1024×1024.jpg
16. 16 http://files.smashingmagazine.com/wallpapers/aug-17/happiness-happens-in-august/cal/aug-17-happiness-happens-in-august-cal-1152×864.jpg
17. 17 http://files.smashingmagazine.com/wallpapers/aug-17/happiness-happens-in-august/cal/aug-17-happiness-happens-in-august-cal-1280×720.jpg
18. 18 http://files.smashingmagazine.com/wallpapers/aug-17/happiness-happens-in-august/cal/aug-17-happiness-happens-in-august-cal-1280×800.jpg
19. 19 http://files.smashingmagazine.com/wallpapers/aug-17/happiness-happens-in-august/cal/aug-17-happiness-happens-in-august-cal-1280×960.jpg
20. 20 http://files.smashingmagazine.com/wallpapers/aug-17/happiness-happens-in-august/cal/aug-17-happiness-happens-in-august-cal-1280×1024.jpg
21. 21 http://files.smashingmagazine.com/wallpapers/aug-17/happiness-happens-in-august/cal/aug-17-happiness-happens-in-august-cal-1366×768.jpg
22. 22 http://files.smashingmagazine.com/wallpapers/aug-17/happiness-happens-in-august/cal/aug-17-happiness-happens-in-august-cal-1400×1050.jpg
23. 23 http://files.smashingmagazine.com/wallpapers/aug-17/happiness-happens-in-august/cal/aug-17-happiness-happens-in-august-cal-1440×900.jpg
24. 24 http://files.smashingmagazine.com/wallpapers/aug-17/happiness-happens-in-august/cal/aug-17-happiness-happens-in-august-cal-1600×1200.jpg
25. 25 http://files.smashingmagazine.com/wallpapers/aug-17/happiness-happens-in-august/cal/aug-17-happiness-happens-in-august-cal-1680×1050.jpg
26. 26 http://files.smashingmagazine.com/wallpapers/aug-17/happiness-happens-in-august/cal/aug-17-happiness-happens-in-august-cal-1680×1200.jpg
27. 27 http://files.smashingmagazine.com/wallpapers/aug-17/happiness-happens-in-august/cal/aug-17-happiness-happens-in-august-cal-1920×1080.jpg
28. 28 http://files.smashingmagazine.com/wallpapers/aug-17/happiness-happens-in-august/cal/aug-17-happiness-happens-in-august-cal-1920×1200.jpg
29. 29 http://files.smashingmagazine.com/wallpapers/aug-17/happiness-happens-in-august/cal/aug-17-happiness-happens-in-august-cal-1920×1440.jpg
30. 30 http://files.smashingmagazine.com/wallpapers/aug-17/happiness-happens-in-august/cal/aug-17-happiness-happens-in-august-cal-2560×1440.jpg
31. 31 http://files.smashingmagazine.com/wallpapers/aug-17/happiness-happens-in-august/nocal/aug-17-happiness-happens-in-august-nocal-320×480.jpg
32. 32 http://files.smashingmagazine.com/wallpapers/aug-17/happiness-happens-in-august/nocal/aug-17-happiness-happens-in-august-nocal-640×480.jpg
33. 33 http://files.smashingmagazine.com/wallpapers/aug-17/happiness-happens-in-august/nocal/aug-17-happiness-happens-in-august-nocal-800×480.jpg
34. 34 http://files.smashingmagazine.com/wallpapers/aug-17/happiness-happens-in-august/nocal/aug-17-happiness-happens-in-august-nocal-800×600.jpg
35. 35 http://files.smashingmagazine.com/wallpapers/aug-17/happiness-happens-in-august/nocal/aug-17-happiness-happens-in-august-nocal-1024×768.jpg
36. 36 http://files.smashingmagazine.com/wallpapers/aug-17/happiness-happens-in-august/nocal/aug-17-happiness-happens-in-august-nocal-1024×1024.jpg
37. 37 http://files.smashingmagazine.com/wallpapers/aug-17/happiness-happens-in-august/nocal/aug-17-happiness-happens-in-august-nocal-1152×864.jpg
38. 38 http://files.smashingmagazine.com/wallpapers/aug-17/happiness-happens-in-august/nocal/aug-17-happiness-happens-in-august-nocal-1280×720.jpg
39. 39 http://files.smashingmagazine.com/wallpapers/aug-17/happiness-happens-in-august/nocal/aug-17-happiness-happens-in-august-nocal-1280×800.jpg
40. 40 http://files.smashingmagazine.com/wallpapers/aug-17/happiness-happens-in-august/nocal/aug-17-happiness-happens-in-august-nocal-1280×960.jpg
41. 41 http://files.smashingmagazine.com/wallpapers/aug-17/happiness-happens-in-august/nocal/aug-17-happiness-happens-in-august-nocal-1280×1024.jpg
42. 42 http://files.smashingmagazine.com/wallpapers/aug-17/happiness-happens-in-august/nocal/aug-17-happiness-happens-in-august-nocal-1366×768.jpg
43. 43 http://files.smashingmagazine.com/wallpapers/aug-17/happiness-happens-in-august/nocal/aug-17-happiness-happens-in-august-nocal-1400×1050.jpg
44. 44 http://files.smashingmagazine.com/wallpapers/aug-17/happiness-happens-in-august/nocal/aug-17-happiness-happens-in-august-nocal-1440×900.jpg
45. 45 http://files.smashingmagazine.com/wallpapers/aug-17/happiness-happens-in-august/nocal/aug-17-happiness-happens-in-august-nocal-1600×1200.jpg
46. 46 http://files.smashingmagazine.com/wallpapers/aug-17/happiness-happens-in-august/nocal/aug-17-happiness-happens-in-august-nocal-1680×1050.jpg
47. 47 http://files.smashingmagazine.com/wallpapers/aug-17/happiness-happens-in-august/nocal/aug-17-happiness-happens-in-august-nocal-1680×1200.jpg
48. 48 http://files.smashingmagazine.com/wallpapers/aug-17/happiness-happens-in-august/nocal/aug-17-happiness-happens-in-august-nocal-1920×1080.jpg
49. 49 http://files.smashingmagazine.com/wallpapers/aug-17/happiness-happens-in-august/nocal/aug-17-happiness-happens-in-august-nocal-1920×1200.jpg
50. 50 http://files.smashingmagazine.com/wallpapers/aug-17/happiness-happens-in-august/nocal/aug-17-happiness-happens-in-august-nocal-1920×1440.jpg
51. 51 http://files.smashingmagazine.com/wallpapers/aug-17/happiness-happens-in-august/nocal/aug-17-happiness-happens-in-august-nocal-2560×1440.jpg
52. 52 https://www.bootstrapdash.com
53. 53 http://files.smashingmagazine.com/wallpapers/aug-17/unforgettable-summer-night/aug-17-unforgettable-summer-night-full.png
54. 54 http://files.smashingmagazine.com/wallpapers/aug-17/unforgettable-summer-night/aug-17-unforgettable-summer-night-preview.png
55. 55 http://files.smashingmagazine.com/wallpapers/aug-17/unforgettable-summer-night/cal/aug-17-unforgettable-summer-night-cal-320×480.png
56. 56 http://files.smashingmagazine.com/wallpapers/aug-17/unforgettable-summer-night/cal/aug-17-unforgettable-summer-night-cal-640×480.png
57. 57 http://files.smashingmagazine.com/wallpapers/aug-17/unforgettable-summer-night/cal/aug-17-unforgettable-summer-night-cal-800×480.png
58. 58 http://files.smashingmagazine.com/wallpapers/aug-17/unforgettable-summer-night/cal/aug-17-unforgettable-summer-night-cal-800×600.png
59. 59 http://files.smashingmagazine.com/wallpapers/aug-17/unforgettable-summer-night/cal/aug-17-unforgettable-summer-night-cal-1024×768.png
60. 60 http://files.smashingmagazine.com/wallpapers/aug-17/unforgettable-summer-night/cal/aug-17-unforgettable-summer-night-cal-1024×1024.png
61. 61 http://files.smashingmagazine.com/wallpapers/aug-17/unforgettable-summer-night/cal/aug-17-unforgettable-summer-night-cal-1152×864.png
62. 62 http://files.smashingmagazine.com/wallpapers/aug-17/unforgettable-summer-night/cal/aug-17-unforgettable-summer-night-cal-1280×720.png
63. 63 http://files.smashingmagazine.com/wallpapers/aug-17/unforgettable-summer-night/cal/aug-17-unforgettable-summer-night-cal-1280×800.png
64. 64 http://files.smashingmagazine.com/wallpapers/aug-17/unforgettable-summer-night/cal/aug-17-unforgettable-summer-night-cal-1280×960.png
65. 65 http://files.smashingmagazine.com/wallpapers/aug-17/unforgettable-summer-night/cal/aug-17-unforgettable-summer-night-cal-1280×1024.png
66. 66 http://files.smashingmagazine.com/wallpapers/aug-17/unforgettable-summer-night/cal/aug-17-unforgettable-summer-night-cal-1366×768.png
67. 67 http://files.smashingmagazine.com/wallpapers/aug-17/unforgettable-summer-night/cal/aug-17-unforgettable-summer-night-cal-1440×900.png
68. 68 http://files.smashingmagazine.com/wallpapers/aug-17/unforgettable-summer-night/cal/aug-17-unforgettable-summer-night-cal-1440×1050.png
69. 69 http://files.smashingmagazine.com/wallpapers/aug-17/unforgettable-summer-night/cal/aug-17-unforgettable-summer-night-cal-1600×1200.png
70. 70 http://files.smashingmagazine.com/wallpapers/aug-17/unforgettable-summer-night/cal/aug-17-unforgettable-summer-night-cal-1680×1050.png
71. 71 http://files.smashingmagazine.com/wallpapers/aug-17/unforgettable-summer-night/cal/aug-17-unforgettable-summer-night-cal-1680×1200.png
72. 72 http://files.smashingmagazine.com/wallpapers/aug-17/unforgettable-summer-night/cal/aug-17-unforgettable-summer-night-cal-1920×1080.png
73. 73 http://files.smashingmagazine.com/wallpapers/aug-17/unforgettable-summer-night/cal/aug-17-unforgettable-summer-night-cal-1920×1200.png
74. 74 http://files.smashingmagazine.com/wallpapers/aug-17/unforgettable-summer-night/cal/aug-17-unforgettable-summer-night-cal-1920×1440.png
75. 75 http://files.smashingmagazine.com/wallpapers/aug-17/unforgettable-summer-night/cal/aug-17-unforgettable-summer-night-cal-2560×1440.png
76. 76 http://files.smashingmagazine.com/wallpapers/aug-17/unforgettable-summer-night/nocal/aug-17-unforgettable-summer-night-nocal-320×480.png
77. 77 http://files.smashingmagazine.com/wallpapers/aug-17/unforgettable-summer-night/nocal/aug-17-unforgettable-summer-night-nocal-640×480.png
78. 78 http://files.smashingmagazine.com/wallpapers/aug-17/unforgettable-summer-night/nocal/aug-17-unforgettable-summer-night-nocal-800×480.png
79. 79 http://files.smashingmagazine.com/wallpapers/aug-17/unforgettable-summer-night/nocal/aug-17-unforgettable-summer-night-nocal-800×600.png
80. 80 http://files.smashingmagazine.com/wallpapers/aug-17/unforgettable-summer-night/nocal/aug-17-unforgettable-summer-night-nocal-1024×768.png
81. 81 http://files.smashingmagazine.com/wallpapers/aug-17/unforgettable-summer-night/nocal/aug-17-unforgettable-summer-night-nocal-1024×1024.png
82. 82 http://files.smashingmagazine.com/wallpapers/aug-17/unforgettable-summer-night/nocal/aug-17-unforgettable-summer-night-nocal-1152×864.png
83. 83 http://files.smashingmagazine.com/wallpapers/aug-17/unforgettable-summer-night/nocal/aug-17-unforgettable-summer-night-nocal-1280×720.png
84. 84 http://files.smashingmagazine.com/wallpapers/aug-17/unforgettable-summer-night/nocal/aug-17-unforgettable-summer-night-nocal-1280×800.png
85. 85 http://files.smashingmagazine.com/wallpapers/aug-17/unforgettable-summer-night/nocal/aug-17-unforgettable-summer-night-nocal-1280×960.png
86. 86 http://files.smashingmagazine.com/wallpapers/aug-17/unforgettable-summer-night/nocal/aug-17-unforgettable-summer-night-nocal-1280×1024.png
87. 87 http://files.smashingmagazine.com/wallpapers/aug-17/unforgettable-summer-night/nocal/aug-17-unforgettable-summer-night-nocal-1366×768.png
88. 88 http://files.smashingmagazine.com/wallpapers/aug-17/unforgettable-summer-night/nocal/aug-17-unforgettable-summer-night-nocal-1440×900.png
89. 89 http://files.smashingmagazine.com/wallpapers/aug-17/unforgettable-summer-night/nocal/aug-17-unforgettable-summer-night-nocal-1440×1050.png
90. 90 http://files.smashingmagazine.com/wallpapers/aug-17/unforgettable-summer-night/nocal/aug-17-unforgettable-summer-night-nocal-1600×1200.png
91. 91 http://files.smashingmagazine.com/wallpapers/aug-17/unforgettable-summer-night/nocal/aug-17-unforgettable-summer-night-nocal-1680×1050.png
92. 92 http://files.smashingmagazine.com/wallpapers/aug-17/unforgettable-summer-night/nocal/aug-17-unforgettable-summer-night-nocal-1680×1200.png
93. 93 http://files.smashingmagazine.com/wallpapers/aug-17/unforgettable-summer-night/nocal/aug-17-unforgettable-summer-night-nocal-1920×1080.png
94. 94 http://files.smashingmagazine.com/wallpapers/aug-17/unforgettable-summer-night/nocal/aug-17-unforgettable-summer-night-nocal-1920×1200.png
95. 95 http://files.smashingmagazine.com/wallpapers/aug-17/unforgettable-summer-night/nocal/aug-17-unforgettable-summer-night-nocal-1920×1440.png
96. 96 http://files.smashingmagazine.com/wallpapers/aug-17/unforgettable-summer-night/nocal/aug-17-unforgettable-summer-night-nocal-2560×1440.png
97. 97 https://www.creitive.com
98. 98 http://files.smashingmagazine.com/wallpapers/aug-17/traveler-in-time/aug-17-traveler-in-time-full.png
99. 99 http://files.smashingmagazine.com/wallpapers/aug-17/traveler-in-time/aug-17-traveler-in-time-preview.png
100. 100 http://files.smashingmagazine.com/wallpapers/aug-17/traveler-in-time/cal/aug-17-traveler-in-time-cal-320×480.png
101. 101 http://files.smashingmagazine.com/wallpapers/aug-17/traveler-in-time/cal/aug-17-traveler-in-time-cal-640×480.png
102. 102 http://files.smashingmagazine.com/wallpapers/aug-17/traveler-in-time/cal/aug-17-traveler-in-time-cal-800×480.png
103. 103 http://files.smashingmagazine.com/wallpapers/aug-17/traveler-in-time/cal/aug-17-traveler-in-time-cal-800×600.png
104. 104 http://files.smashingmagazine.com/wallpapers/aug-17/traveler-in-time/cal/aug-17-traveler-in-time-cal-1024×768.png
105. 105 http://files.smashingmagazine.com/wallpapers/aug-17/traveler-in-time/cal/aug-17-traveler-in-time-cal-1024×1024.png
106. 106 http://files.smashingmagazine.com/wallpapers/aug-17/traveler-in-time/cal/aug-17-traveler-in-time-cal-1152×864.png
107. 107 http://files.smashingmagazine.com/wallpapers/aug-17/traveler-in-time/cal/aug-17-traveler-in-time-cal-1280×720.png
108. 108 http://files.smashingmagazine.com/wallpapers/aug-17/traveler-in-time/cal/aug-17-traveler-in-time-cal-1280×800.png
109. 109 http://files.smashingmagazine.com/wallpapers/aug-17/traveler-in-time/cal/aug-17-traveler-in-time-cal-1280×960.png
110. 110 http://files.smashingmagazine.com/wallpapers/aug-17/traveler-in-time/cal/aug-17-traveler-in-time-cal-1280×1024.png
111. 111 http://files.smashingmagazine.com/wallpapers/aug-17/traveler-in-time/cal/aug-17-traveler-in-time-cal-1400×1050.png
112. 112 http://files.smashingmagazine.com/wallpapers/aug-17/traveler-in-time/cal/aug-17-traveler-in-time-cal-1440×900.png
113. 113 http://files.smashingmagazine.com/wallpapers/aug-17/traveler-in-time/cal/aug-17-traveler-in-time-cal-1600×1200.png
114. 114 http://files.smashingmagazine.com/wallpapers/aug-17/traveler-in-time/cal/aug-17-traveler-in-time-cal-1680×1050.png
115. 115 http://files.smashingmagazine.com/wallpapers/aug-17/traveler-in-time/cal/aug-17-traveler-in-time-cal-1680×1200.png
116. 116 http://files.smashingmagazine.com/wallpapers/aug-17/traveler-in-time/cal/aug-17-traveler-in-time-cal-1920×1080.png
117. 117 http://files.smashingmagazine.com/wallpapers/aug-17/traveler-in-time/cal/aug-17-traveler-in-time-cal-1920×1200.png
118. 118 http://files.smashingmagazine.com/wallpapers/aug-17/traveler-in-time/cal/aug-17-traveler-in-time-cal-1920×1440.png
119. 119 http://files.smashingmagazine.com/wallpapers/aug-17/traveler-in-time/cal/aug-17-traveler-in-time-cal-2560×1440.png
120. 120 http://files.smashingmagazine.com/wallpapers/aug-17/traveler-in-time/nocal/aug-17-traveler-in-time-nocal-320×480.png
121. 121 http://files.smashingmagazine.com/wallpapers/aug-17/traveler-in-time/nocal/aug-17-traveler-in-time-nocal-640×480.png
122. 122 http://files.smashingmagazine.com/wallpapers/aug-17/traveler-in-time/nocal/aug-17-traveler-in-time-nocal-800×480.png
123. 123 http://files.smashingmagazine.com/wallpapers/aug-17/traveler-in-time/nocal/aug-17-traveler-in-time-nocal-800×600.png
124. 124 http://files.smashingmagazine.com/wallpapers/aug-17/traveler-in-time/nocal/aug-17-traveler-in-time-nocal-1024×768.png
125. 125 http://files.smashingmagazine.com/wallpapers/aug-17/traveler-in-time/nocal/aug-17-traveler-in-time-nocal-1024×1024.png
126. 126 http://files.smashingmagazine.com/wallpapers/aug-17/traveler-in-time/nocal/aug-17-traveler-in-time-nocal-1152×864.png
127. 127 http://files.smashingmagazine.com/wallpapers/aug-17/traveler-in-time/nocal/aug-17-traveler-in-time-nocal-1280×720.png
128. 128 http://files.smashingmagazine.com/wallpapers/aug-17/traveler-in-time/nocal/aug-17-traveler-in-time-nocal-1280×800.png
129. 129 http://files.smashingmagazine.com/wallpapers/aug-17/traveler-in-time/nocal/aug-17-traveler-in-time-nocal-1280×960.png
130. 130 http://files.smashingmagazine.com/wallpapers/aug-17/traveler-in-time/nocal/aug-17-traveler-in-time-nocal-1280×1024.png
131. 131 http://files.smashingmagazine.com/wallpapers/aug-17/traveler-in-time/nocal/aug-17-traveler-in-time-nocal-1400×1050.png
132. 132 http://files.smashingmagazine.com/wallpapers/aug-17/traveler-in-time/nocal/aug-17-traveler-in-time-nocal-1440×900.png
133. 133 http://files.smashingmagazine.com/wallpapers/aug-17/traveler-in-time/nocal/aug-17-traveler-in-time-nocal-1600×1200.png
134. 134 http://files.smashingmagazine.com/wallpapers/aug-17/traveler-in-time/nocal/aug-17-traveler-in-time-nocal-1680×1050.png
135. 135 http://files.smashingmagazine.com/wallpapers/aug-17/traveler-in-time/nocal/aug-17-traveler-in-time-nocal-1680×1200.png
136. 136 http://files.smashingmagazine.com/wallpapers/aug-17/traveler-in-time/nocal/aug-17-traveler-in-time-nocal-1920×1080.png
137. 137 http://files.smashingmagazine.com/wallpapers/aug-17/traveler-in-time/nocal/aug-17-traveler-in-time-nocal-1920×1200.png
138. 138 http://files.smashingmagazine.com/wallpapers/aug-17/traveler-in-time/nocal/aug-17-traveler-in-time-nocal-1920×1440.png
139. 139 http://files.smashingmagazine.com/wallpapers/aug-17/traveler-in-time/nocal/aug-17-traveler-in-time-nocal-2560×1440.png
140. 140 http://www.urbanui.com
141. 141 http://files.smashingmagazine.com/wallpapers/aug-17/are-you-ready-for-the-adventure/aug-17-are-you-ready-for-the-adventure-full.png
142. 142 http://files.smashingmagazine.com/wallpapers/aug-17/are-you-ready-for-the-adventure/aug-17-are-you-ready-for-the-adventure-preview.png
143. 143 http://files.smashingmagazine.com/wallpapers/aug-17/are-you-ready-for-the-adventure/cal/aug-17-are-you-ready-for-the-adventure-cal-320×480.png
144. 144 http://files.smashingmagazine.com/wallpapers/aug-17/are-you-ready-for-the-adventure/cal/aug-17-are-you-ready-for-the-adventure-cal-640×480.png
145. 145 http://files.smashingmagazine.com/wallpapers/aug-17/are-you-ready-for-the-adventure/cal/aug-17-are-you-ready-for-the-adventure-cal-800×480.png
146. 146 http://files.smashingmagazine.com/wallpapers/aug-17/are-you-ready-for-the-adventure/cal/aug-17-are-you-ready-for-the-adventure-cal-800×600.png
147. 147 http://files.smashingmagazine.com/wallpapers/aug-17/are-you-ready-for-the-adventure/cal/aug-17-are-you-ready-for-the-adventure-cal-1024×768.png
148. 148 http://files.smashingmagazine.com/wallpapers/aug-17/are-you-ready-for-the-adventure/cal/aug-17-are-you-ready-for-the-adventure-cal-1024×1024.png
149. 149 http://files.smashingmagazine.com/wallpapers/aug-17/are-you-ready-for-the-adventure/cal/aug-17-are-you-ready-for-the-adventure-cal-1152×864.png
150. 150 http://files.smashingmagazine.com/wallpapers/aug-17/are-you-ready-for-the-adventure/cal/aug-17-are-you-ready-for-the-adventure-cal-1280×720.png
151. 151 http://files.smashingmagazine.com/wallpapers/aug-17/are-you-ready-for-the-adventure/cal/aug-17-are-you-ready-for-the-adventure-cal-1280×800.png
152. 152 http://files.smashingmagazine.com/wallpapers/aug-17/are-you-ready-for-the-adventure/cal/aug-17-are-you-ready-for-the-adventure-cal-1280×960.png
153. 153 http://files.smashingmagazine.com/wallpapers/aug-17/are-you-ready-for-the-adventure/cal/aug-17-are-you-ready-for-the-adventure-cal-1280×1024.png
154. 154 http://files.smashingmagazine.com/wallpapers/aug-17/are-you-ready-for-the-adventure/cal/aug-17-are-you-ready-for-the-adventure-cal-1366×768.png
155. 155 http://files.smashingmagazine.com/wallpapers/aug-17/are-you-ready-for-the-adventure/cal/aug-17-are-you-ready-for-the-adventure-cal-1440×900.png
156. 156 http://files.smashingmagazine.com/wallpapers/aug-17/are-you-ready-for-the-adventure/cal/aug-17-are-you-ready-for-the-adventure-cal-1440×1050.png
157. 157 http://files.smashingmagazine.com/wallpapers/aug-17/are-you-ready-for-the-adventure/cal/aug-17-are-you-ready-for-the-adventure-cal-1600×1200.png
158. 158 http://files.smashingmagazine.com/wallpapers/aug-17/are-you-ready-for-the-adventure/cal/aug-17-are-you-ready-for-the-adventure-cal-1680×1050.png
159. 159 http://files.smashingmagazine.com/wallpapers/aug-17/are-you-ready-for-the-adventure/cal/aug-17-are-you-ready-for-the-adventure-cal-1680×1200.png
160. 160 http://files.smashingmagazine.com/wallpapers/aug-17/are-you-ready-for-the-adventure/cal/aug-17-are-you-ready-for-the-adventure-cal-1920×1080.png
161. 161 http://files.smashingmagazine.com/wallpapers/aug-17/are-you-ready-for-the-adventure/cal/aug-17-are-you-ready-for-the-adventure-cal-1920×1440.png
162. 162 http://files.smashingmagazine.com/wallpapers/aug-17/are-you-ready-for-the-adventure/nocal/aug-17-are-you-ready-for-the-adventure-nocal-320×480.png
163. 163 http://files.smashingmagazine.com/wallpapers/aug-17/are-you-ready-for-the-adventure/nocal/aug-17-are-you-ready-for-the-adventure-nocal-640×480.png
164. 164 http://files.smashingmagazine.com/wallpapers/aug-17/are-you-ready-for-the-adventure/nocal/aug-17-are-you-ready-for-the-adventure-nocal-800×480.png
165. 165 http://files.smashingmagazine.com/wallpapers/aug-17/are-you-ready-for-the-adventure/nocal/aug-17-are-you-ready-for-the-adventure-nocal-800×600.png
166. 166 http://files.smashingmagazine.com/wallpapers/aug-17/are-you-ready-for-the-adventure/nocal/aug-17-are-you-ready-for-the-adventure-nocal-1024×768.png
167. 167 http://files.smashingmagazine.com/wallpapers/aug-17/are-you-ready-for-the-adventure/nocal/aug-17-are-you-ready-for-the-adventure-nocal-1024×1024.png
168. 168 http://files.smashingmagazine.com/wallpapers/aug-17/are-you-ready-for-the-adventure/nocal/aug-17-are-you-ready-for-the-adventure-nocal-1152×864.png
169. 169 http://files.smashingmagazine.com/wallpapers/aug-17/are-you-ready-for-the-adventure/nocal/aug-17-are-you-ready-for-the-adventure-nocal-1280×720.png
170. 170 http://files.smashingmagazine.com/wallpapers/aug-17/are-you-ready-for-the-adventure/nocal/aug-17-are-you-ready-for-the-adventure-nocal-1280×800.png
171. 171 http://files.smashingmagazine.com/wallpapers/aug-17/are-you-ready-for-the-adventure/nocal/aug-17-are-you-ready-for-the-adventure-nocal-1280×960.png
172. 172 http://files.smashingmagazine.com/wallpapers/aug-17/are-you-ready-for-the-adventure/nocal/aug-17-are-you-ready-for-the-adventure-nocal-1280×1024.png
173. 173 http://files.smashingmagazine.com/wallpapers/aug-17/are-you-ready-for-the-adventure/nocal/aug-17-are-you-ready-for-the-adventure-nocal-1366×768.png
174. 174 http://files.smashingmagazine.com/wallpapers/aug-17/are-you-ready-for-the-adventure/nocal/aug-17-are-you-ready-for-the-adventure-nocal-1440×900.png
175. 175 http://files.smashingmagazine.com/wallpapers/aug-17/are-you-ready-for-the-adventure/nocal/aug-17-are-you-ready-for-the-adventure-nocal-1440×1050.png
176. 176 http://files.smashingmagazine.com/wallpapers/aug-17/are-you-ready-for-the-adventure/nocal/aug-17-are-you-ready-for-the-adventure-nocal-1600×1200.png
177. 177 http://files.smashingmagazine.com/wallpapers/aug-17/are-you-ready-for-the-adventure/nocal/aug-17-are-you-ready-for-the-adventure-nocal-1680×1050.png
178. 178 http://files.smashingmagazine.com/wallpapers/aug-17/are-you-ready-for-the-adventure/nocal/aug-17-are-you-ready-for-the-adventure-nocal-1680×1200.png
179. 179 http://files.smashingmagazine.com/wallpapers/aug-17/are-you-ready-for-the-adventure/nocal/aug-17-are-you-ready-for-the-adventure-nocal-1920×1080.png
180. 180 http://files.smashingmagazine.com/wallpapers/aug-17/are-you-ready-for-the-adventure/nocal/aug-17-are-you-ready-for-the-adventure-nocal-1920×1440.png
181. 181 https://www.upwork.com/freelancers/~0120e9966be1097d99
182. 182 http://files.smashingmagazine.com/wallpapers/aug-17/i-love-summer/aug-17-i-love-summer-full.png
183. 183 http://files.smashingmagazine.com/wallpapers/aug-17/i-love-summer/aug-17-i-love-summer-preview.png
184. 184 http://files.smashingmagazine.com/wallpapers/aug-17/i-love-summer/cal/aug-17-i-love-summer-cal-320×480.png
185. 185 http://files.smashingmagazine.com/wallpapers/aug-17/i-love-summer/cal/aug-17-i-love-summer-cal-640×480.png
186. 186 http://files.smashingmagazine.com/wallpapers/aug-17/i-love-summer/cal/aug-17-i-love-summer-cal-800×480.png
187. 187 http://files.smashingmagazine.com/wallpapers/aug-17/i-love-summer/cal/aug-17-i-love-summer-cal-800×600.png
188. 188 http://files.smashingmagazine.com/wallpapers/aug-17/i-love-summer/cal/aug-17-i-love-summer-cal-1024×768.png
189. 189 http://files.smashingmagazine.com/wallpapers/aug-17/i-love-summer/cal/aug-17-i-love-summer-cal-1024×1024.png
190. 190 http://files.smashingmagazine.com/wallpapers/aug-17/i-love-summer/cal/aug-17-i-love-summer-cal-1152×864.png
191. 191 http://files.smashingmagazine.com/wallpapers/aug-17/i-love-summer/cal/aug-17-i-love-summer-cal-1280×720.png
192. 192 http://files.smashingmagazine.com/wallpapers/aug-17/i-love-summer/cal/aug-17-i-love-summer-cal-1280×800.png
193. 193 http://files.smashingmagazine.com/wallpapers/aug-17/i-love-summer/cal/aug-17-i-love-summer-cal-1280×960.png
194. 194 http://files.smashingmagazine.com/wallpapers/aug-17/i-love-summer/cal/aug-17-i-love-summer-cal-1280×1024.png
195. 195 http://files.smashingmagazine.com/wallpapers/aug-17/i-love-summer/cal/aug-17-i-love-summer-cal-1366×768.png
196. 196 http://files.smashingmagazine.com/wallpapers/aug-17/i-love-summer/cal/aug-17-i-love-summer-cal-1440×900.png
197. 197 http://files.smashingmagazine.com/wallpapers/aug-17/i-love-summer/cal/aug-17-i-love-summer-cal-1440×1050.png
198. 198 http://files.smashingmagazine.com/wallpapers/aug-17/i-love-summer/cal/aug-17-i-love-summer-cal-1600×1200.png
199. 199 http://files.smashingmagazine.com/wallpapers/aug-17/i-love-summer/cal/aug-17-i-love-summer-cal-1680×1050.png
200. 200 http://files.smashingmagazine.com/wallpapers/aug-17/i-love-summer/cal/aug-17-i-love-summer-cal-1680×1200.png
201. 201 http://files.smashingmagazine.com/wallpapers/aug-17/i-love-summer/cal/aug-17-i-love-summer-cal-1920×1080.png
202. 202 http://files.smashingmagazine.com/wallpapers/aug-17/i-love-summer/cal/aug-17-i-love-summer-cal-1920×1200.png
203. 203 http://files.smashingmagazine.com/wallpapers/aug-17/i-love-summer/cal/aug-17-i-love-summer-cal-1920×1440.png
204. 204 http://files.smashingmagazine.com/wallpapers/aug-17/i-love-summer/cal/aug-17-i-love-summer-cal-2560×1440.png
205. 205 http://files.smashingmagazine.com/wallpapers/aug-17/i-love-summer/nocal/aug-17-i-love-summer-nocal-320×480.png
206. 206 http://files.smashingmagazine.com/wallpapers/aug-17/i-love-summer/nocal/aug-17-i-love-summer-nocal-640×480.png
207. 207 http://files.smashingmagazine.com/wallpapers/aug-17/i-love-summer/nocal/aug-17-i-love-summer-nocal-800×480.png
208. 208 http://files.smashingmagazine.com/wallpapers/aug-17/i-love-summer/nocal/aug-17-i-love-summer-nocal-800×600.png
209. 209 http://files.smashingmagazine.com/wallpapers/aug-17/i-love-summer/nocal/aug-17-i-love-summer-nocal-1024×768.png
210. 210 http://files.smashingmagazine.com/wallpapers/aug-17/i-love-summer/nocal/aug-17-i-love-summer-nocal-1024×1024.png
211. 211 http://files.smashingmagazine.com/wallpapers/aug-17/i-love-summer/nocal/aug-17-i-love-summer-nocal-1152×864.png
212. 212 http://files.smashingmagazine.com/wallpapers/aug-17/i-love-summer/nocal/aug-17-i-love-summer-nocal-1280×720.png
213. 213 http://files.smashingmagazine.com/wallpapers/aug-17/i-love-summer/nocal/aug-17-i-love-summer-nocal-1280×800.png
214. 214 http://files.smashingmagazine.com/wallpapers/aug-17/i-love-summer/nocal/aug-17-i-love-summer-nocal-1280×960.png
215. 215 http://files.smashingmagazine.com/wallpapers/aug-17/i-love-summer/nocal/aug-17-i-love-summer-nocal-1280×1024.png
216. 216 http://files.smashingmagazine.com/wallpapers/aug-17/i-love-summer/nocal/aug-17-i-love-summer-nocal-1366×768.png
217. 217 http://files.smashingmagazine.com/wallpapers/aug-17/i-love-summer/nocal/aug-17-i-love-summer-nocal-1440×900.png
218. 218 http://files.smashingmagazine.com/wallpapers/aug-17/i-love-summer/nocal/aug-17-i-love-summer-nocal-1440×1050.png
219. 219 http://files.smashingmagazine.com/wallpapers/aug-17/i-love-summer/nocal/aug-17-i-love-summer-nocal-1600×1200.png
220. 220 http://files.smashingmagazine.com/wallpapers/aug-17/i-love-summer/nocal/aug-17-i-love-summer-nocal-1680×1050.png
221. 221 http://files.smashingmagazine.com/wallpapers/aug-17/i-love-summer/nocal/aug-17-i-love-summer-nocal-1680×1200.png
222. 222 http://files.smashingmagazine.com/wallpapers/aug-17/i-love-summer/nocal/aug-17-i-love-summer-nocal-1920×1080.png
223. 223 http://files.smashingmagazine.com/wallpapers/aug-17/i-love-summer/nocal/aug-17-i-love-summer-nocal-1920×1200.png
224. 224 http://files.smashingmagazine.com/wallpapers/aug-17/i-love-summer/nocal/aug-17-i-love-summer-nocal-1920×1440.png
225. 225 http://files.smashingmagazine.com/wallpapers/aug-17/i-love-summer/nocal/aug-17-i-love-summer-nocal-2560×1440.png
226. 226 http://melissa.bogemans.com
227. 227 http://files.smashingmagazine.com/wallpapers/aug-17/melon-day/aug-17-melon-day-full.png
228. 228 http://files.smashingmagazine.com/wallpapers/aug-17/melon-day/aug-17-melon-day-preview.png
229. 229 http://files.smashingmagazine.com/wallpapers/aug-17/melon-day/cal/aug-17-melon-day-cal-320×480.png
230. 230 http://files.smashingmagazine.com/wallpapers/aug-17/melon-day/cal/aug-17-melon-day-cal-640×480.png
231. 231 http://files.smashingmagazine.com/wallpapers/aug-17/melon-day/cal/aug-17-melon-day-cal-800×480.png
232. 232 http://files.smashingmagazine.com/wallpapers/aug-17/melon-day/cal/aug-17-melon-day-cal-800×600.png
233. 233 http://files.smashingmagazine.com/wallpapers/aug-17/melon-day/cal/aug-17-melon-day-cal-1024×768.png
234. 234 http://files.smashingmagazine.com/wallpapers/aug-17/melon-day/cal/aug-17-melon-day-cal-1024×1024.png
235. 235 http://files.smashingmagazine.com/wallpapers/aug-17/melon-day/cal/aug-17-melon-day-cal-1152×864.png
236. 236 http://files.smashingmagazine.com/wallpapers/aug-17/melon-day/cal/aug-17-melon-day-cal-1280×720.png
237. 237 http://files.smashingmagazine.com/wallpapers/aug-17/melon-day/cal/aug-17-melon-day-cal-1280×800.png
238. 238 http://files.smashingmagazine.com/wallpapers/aug-17/melon-day/cal/aug-17-melon-day-cal-1280×960.png
239. 239 http://files.smashingmagazine.com/wallpapers/aug-17/melon-day/cal/aug-17-melon-day-cal-1280×1024.png
240. 240 http://files.smashingmagazine.com/wallpapers/aug-17/melon-day/cal/aug-17-melon-day-cal-1400×1050.png
241. 241 http://files.smashingmagazine.com/wallpapers/aug-17/melon-day/cal/aug-17-melon-day-cal-1440×900.png
242. 242 http://files.smashingmagazine.com/wallpapers/aug-17/melon-day/cal/aug-17-melon-day-cal-1600×1200.png
243. 243 http://files.smashingmagazine.com/wallpapers/aug-17/melon-day/cal/aug-17-melon-day-cal-1680×1050.png
244. 244 http://files.smashingmagazine.com/wallpapers/aug-17/melon-day/cal/aug-17-melon-day-cal-1680×1200.png
245. 245 http://files.smashingmagazine.com/wallpapers/aug-17/melon-day/cal/aug-17-melon-day-cal-1920×1080.png
246. 246 http://files.smashingmagazine.com/wallpapers/aug-17/melon-day/cal/aug-17-melon-day-cal-1920×1200.png
247. 247 http://files.smashingmagazine.com/wallpapers/aug-17/melon-day/cal/aug-17-melon-day-cal-1920×1440.png
248. 248 http://files.smashingmagazine.com/wallpapers/aug-17/melon-day/cal/aug-17-melon-day-cal-2560×1440.png
249. 249 http://files.smashingmagazine.com/wallpapers/aug-17/melon-day/nocal/aug-17-melon-day-nocal-320×480.png
250. 250 http://files.smashingmagazine.com/wallpapers/aug-17/melon-day/nocal/aug-17-melon-day-nocal-640×480.png
251. 251 http://files.smashingmagazine.com/wallpapers/aug-17/melon-day/nocal/aug-17-melon-day-nocal-800×480.png
252. 252 http://files.smashingmagazine.com/wallpapers/aug-17/melon-day/nocal/aug-17-melon-day-nocal-800×600.png
253. 253 http://files.smashingmagazine.com/wallpapers/aug-17/melon-day/nocal/aug-17-melon-day-nocal-1024×768.png
254. 254 http://files.smashingmagazine.com/wallpapers/aug-17/melon-day/nocal/aug-17-melon-day-nocal-1024×1024.png
255. 255 http://files.smashingmagazine.com/wallpapers/aug-17/melon-day/nocal/aug-17-melon-day-nocal-1152×864.png
256. 256 http://files.smashingmagazine.com/wallpapers/aug-17/melon-day/nocal/aug-17-melon-day-nocal-1280×720.png
257. 257 http://files.smashingmagazine.com/wallpapers/aug-17/melon-day/nocal/aug-17-melon-day-nocal-1280×800.png
258. 258 http://files.smashingmagazine.com/wallpapers/aug-17/melon-day/nocal/aug-17-melon-day-nocal-1280×960.png
259. 259 http://files.smashingmagazine.com/wallpapers/aug-17/melon-day/nocal/aug-17-melon-day-nocal-1280×1024.png
260. 260 http://files.smashingmagazine.com/wallpapers/aug-17/melon-day/nocal/aug-17-melon-day-nocal-1400×1050.png
261. 261 http://files.smashingmagazine.com/wallpapers/aug-17/melon-day/nocal/aug-17-melon-day-nocal-1440×900.png
262. 262 http://files.smashingmagazine.com/wallpapers/aug-17/melon-day/nocal/aug-17-melon-day-nocal-1600×1200.png
263. 263 http://files.smashingmagazine.com/wallpapers/aug-17/melon-day/nocal/aug-17-melon-day-nocal-1680×1050.png
264. 264 http://files.smashingmagazine.com/wallpapers/aug-17/melon-day/nocal/aug-17-melon-day-nocal-1680×1200.png
265. 265 http://files.smashingmagazine.com/wallpapers/aug-17/melon-day/nocal/aug-17-melon-day-nocal-1920×1080.png
266. 266 http://files.smashingmagazine.com/wallpapers/aug-17/melon-day/nocal/aug-17-melon-day-nocal-1920×1200.png
267. 267 http://files.smashingmagazine.com/wallpapers/aug-17/melon-day/nocal/aug-17-melon-day-nocal-1920×1440.png
268. 268 http://files.smashingmagazine.com/wallpapers/aug-17/melon-day/nocal/aug-17-melon-day-nocal-2560×1440.png
269. 269 http://www.pluscharts.com
270. 270 http://files.smashingmagazine.com/wallpapers/aug-17/time-to-surf/aug-17-time-to-surf-full.png
271. 271 http://files.smashingmagazine.com/wallpapers/aug-17/time-to-surf/aug-17-time-to-surf-preview.png
272. 272 http://files.smashingmagazine.com/wallpapers/aug-17/time-to-surf/cal/aug-17-time-to-surf-cal-320×480.png
273. 273 http://files.smashingmagazine.com/wallpapers/aug-17/time-to-surf/cal/aug-17-time-to-surf-cal-640×480.png
274. 274 http://files.smashingmagazine.com/wallpapers/aug-17/time-to-surf/cal/aug-17-time-to-surf-cal-800×480.png
275. 275 http://files.smashingmagazine.com/wallpapers/aug-17/time-to-surf/cal/aug-17-time-to-surf-cal-800×600.png
276. 276 http://files.smashingmagazine.com/wallpapers/aug-17/time-to-surf/cal/aug-17-time-to-surf-cal-1024×768.png
277. 277 http://files.smashingmagazine.com/wallpapers/aug-17/time-to-surf/cal/aug-17-time-to-surf-cal-1024×1024.png
278. 278 http://files.smashingmagazine.com/wallpapers/aug-17/time-to-surf/cal/aug-17-time-to-surf-cal-1152×864.png
279. 279 http://files.smashingmagazine.com/wallpapers/aug-17/time-to-surf/cal/aug-17-time-to-surf-cal-1280×720.png
280. 280 http://files.smashingmagazine.com/wallpapers/aug-17/time-to-surf/cal/aug-17-time-to-surf-cal-1280×800.png
281. 281 http://files.smashingmagazine.com/wallpapers/aug-17/time-to-surf/cal/aug-17-time-to-surf-cal-1280×960.png
282. 282 http://files.smashingmagazine.com/wallpapers/aug-17/time-to-surf/cal/aug-17-time-to-surf-cal-1280×1024.png
283. 283 http://files.smashingmagazine.com/wallpapers/aug-17/time-to-surf/cal/aug-17-time-to-surf-cal-1366×768.png
284. 284 http://files.smashingmagazine.com/wallpapers/aug-17/time-to-surf/cal/aug-17-time-to-surf-cal-1440×900.png
285. 285 http://files.smashingmagazine.com/wallpapers/aug-17/time-to-surf/cal/aug-17-time-to-surf-cal-1440×1050.png
286. 286 http://files.smashingmagazine.com/wallpapers/aug-17/time-to-surf/cal/aug-17-time-to-surf-cal-1600×1200.png
287. 287 http://files.smashingmagazine.com/wallpapers/aug-17/time-to-surf/cal/aug-17-time-to-surf-cal-1680×1050.png
288. 288 http://files.smashingmagazine.com/wallpapers/aug-17/time-to-surf/cal/aug-17-time-to-surf-cal-1680×1200.png
289. 289 http://files.smashingmagazine.com/wallpapers/aug-17/time-to-surf/cal/aug-17-time-to-surf-cal-1920×1080.png
290. 290 http://files.smashingmagazine.com/wallpapers/aug-17/time-to-surf/cal/aug-17-time-to-surf-cal-1920×1200.png
291. 291 http://files.smashingmagazine.com/wallpapers/aug-17/time-to-surf/cal/aug-17-time-to-surf-cal-1920×1440.png
292. 292 http://files.smashingmagazine.com/wallpapers/aug-17/time-to-surf/cal/aug-17-time-to-surf-cal-2560×1440.png
293. 293 http://files.smashingmagazine.com/wallpapers/aug-17/time-to-surf/nocal/aug-17-time-to-surf-nocal-320×480.png
294. 294 http://files.smashingmagazine.com/wallpapers/aug-17/time-to-surf/nocal/aug-17-time-to-surf-nocal-640×480.png
295. 295 http://files.smashingmagazine.com/wallpapers/aug-17/time-to-surf/nocal/aug-17-time-to-surf-nocal-800×480.png
296. 296 http://files.smashingmagazine.com/wallpapers/aug-17/time-to-surf/nocal/aug-17-time-to-surf-nocal-800×600.png
297. 297 http://files.smashingmagazine.com/wallpapers/aug-17/time-to-surf/nocal/aug-17-time-to-surf-nocal-1024×768.png
298. 298 http://files.smashingmagazine.com/wallpapers/aug-17/time-to-surf/nocal/aug-17-time-to-surf-nocal-1024×1024.png
299. 299 http://files.smashingmagazine.com/wallpapers/aug-17/time-to-surf/nocal/aug-17-time-to-surf-nocal-1152×864.png
300. 300 http://files.smashingmagazine.com/wallpapers/aug-17/time-to-surf/nocal/aug-17-time-to-surf-nocal-1280×720.png
301. 301 http://files.smashingmagazine.com/wallpapers/aug-17/time-to-surf/nocal/aug-17-time-to-surf-nocal-1280×800.png
302. 302 http://files.smashingmagazine.com/wallpapers/aug-17/time-to-surf/nocal/aug-17-time-to-surf-nocal-1280×960.png
303. 303 http://files.smashingmagazine.com/wallpapers/aug-17/time-to-surf/nocal/aug-17-time-to-surf-nocal-1280×1024.png
304. 304 http://files.smashingmagazine.com/wallpapers/aug-17/time-to-surf/nocal/aug-17-time-to-surf-nocal-1366×768.png
305. 305 http://files.smashingmagazine.com/wallpapers/aug-17/time-to-surf/nocal/aug-17-time-to-surf-nocal-1440×900.png
306. 306 http://files.smashingmagazine.com/wallpapers/aug-17/time-to-surf/nocal/aug-17-time-to-surf-nocal-1440×1050.png
307. 307 http://files.smashingmagazine.com/wallpapers/aug-17/time-to-surf/nocal/aug-17-time-to-surf-nocal-1600×1200.png
308. 308 http://files.smashingmagazine.com/wallpapers/aug-17/time-to-surf/nocal/aug-17-time-to-surf-nocal-1680×1050.png
309. 309 http://files.smashingmagazine.com/wallpapers/aug-17/time-to-surf/nocal/aug-17-time-to-surf-nocal-1680×1200.png
310. 310 http://files.smashingmagazine.com/wallpapers/aug-17/time-to-surf/nocal/aug-17-time-to-surf-nocal-1920×1080.png
311. 311 http://files.smashingmagazine.com/wallpapers/aug-17/time-to-surf/nocal/aug-17-time-to-surf-nocal-1920×1200.png
312. 312 http://files.smashingmagazine.com/wallpapers/aug-17/time-to-surf/nocal/aug-17-time-to-surf-nocal-1920×1440.png
313. 313 http://files.smashingmagazine.com/wallpapers/aug-17/time-to-surf/nocal/aug-17-time-to-surf-nocal-2560×1440.png
314. 314 http://0effortthemes.com/
315. 315 http://files.smashingmagazine.com/wallpapers/aug-17/la-tomatina-festival/aug-17-la-tomatina-festival-full.jpg
316. 316 http://files.smashingmagazine.com/wallpapers/aug-17/la-tomatina-festival/aug-17-la-tomatina-festival-preview.jpg
317. 317 http://files.smashingmagazine.com/wallpapers/aug-17/la-tomatina-festival/cal/aug-17-la-tomatina-festival-cal-1280×720.jpg
318. 318 http://files.smashingmagazine.com/wallpapers/aug-17/la-tomatina-festival/cal/aug-17-la-tomatina-festival-cal-1280×800.jpg
319. 319 http://files.smashingmagazine.com/wallpapers/aug-17/la-tomatina-festival/cal/aug-17-la-tomatina-festival-cal-1280×960.jpg
320. 320 http://files.smashingmagazine.com/wallpapers/aug-17/la-tomatina-festival/cal/aug-17-la-tomatina-festival-cal-1280×1024.jpg
321. 321 http://files.smashingmagazine.com/wallpapers/aug-17/la-tomatina-festival/cal/aug-17-la-tomatina-festival-cal-1366×768.jpg
322. 322 http://files.smashingmagazine.com/wallpapers/aug-17/la-tomatina-festival/cal/aug-17-la-tomatina-festival-cal-1400×1050.jpg
323. 323 http://files.smashingmagazine.com/wallpapers/aug-17/la-tomatina-festival/cal/aug-17-la-tomatina-festival-cal-1440×900.jpg
324. 324 http://files.smashingmagazine.com/wallpapers/aug-17/la-tomatina-festival/cal/aug-17-la-tomatina-festival-cal-1600×1200.jpg
325. 325 http://files.smashingmagazine.com/wallpapers/aug-17/la-tomatina-festival/cal/aug-17-la-tomatina-festival-cal-1680×1050.jpg
326. 326 http://files.smashingmagazine.com/wallpapers/aug-17/la-tomatina-festival/cal/aug-17-la-tomatina-festival-cal-1680×1200.jpg
327. 327 http://files.smashingmagazine.com/wallpapers/aug-17/la-tomatina-festival/cal/aug-17-la-tomatina-festival-cal-1920×1080.jpg
328. 328 http://files.smashingmagazine.com/wallpapers/aug-17/la-tomatina-festival/cal/aug-17-la-tomatina-festival-cal-1920×1200.jpg
329. 329 http://files.smashingmagazine.com/wallpapers/aug-17/la-tomatina-festival/cal/aug-17-la-tomatina-festival-cal-1920×1440.jpg
330. 330 http://files.smashingmagazine.com/wallpapers/aug-17/la-tomatina-festival/cal/aug-17-la-tomatina-festival-cal-2560×1440.jpg
331. 331 http://files.smashingmagazine.com/wallpapers/aug-17/la-tomatina-festival/nocal/aug-17-la-tomatina-festival-nocal-1280×720.jpg
332. 332 http://files.smashingmagazine.com/wallpapers/aug-17/la-tomatina-festival/nocal/aug-17-la-tomatina-festival-nocal-1280×800.jpg
333. 333 http://files.smashingmagazine.com/wallpapers/aug-17/la-tomatina-festival/nocal/aug-17-la-tomatina-festival-nocal-1280×960.jpg
334. 334 http://files.smashingmagazine.com/wallpapers/aug-17/la-tomatina-festival/nocal/aug-17-la-tomatina-festival-nocal-1280×1024.jpg
335. 335 http://files.smashingmagazine.com/wallpapers/aug-17/la-tomatina-festival/nocal/aug-17-la-tomatina-festival-nocal-1366×768.jpg
336. 336 http://files.smashingmagazine.com/wallpapers/aug-17/la-tomatina-festival/nocal/aug-17-la-tomatina-festival-nocal-1400×1050.jpg
337. 337 http://files.smashingmagazine.com/wallpapers/aug-17/la-tomatina-festival/nocal/aug-17-la-tomatina-festival-nocal-1440×900.jpg
338. 338 http://files.smashingmagazine.com/wallpapers/aug-17/la-tomatina-festival/nocal/aug-17-la-tomatina-festival-nocal-1600×1200.jpg
339. 339 http://files.smashingmagazine.com/wallpapers/aug-17/la-tomatina-festival/nocal/aug-17-la-tomatina-festival-nocal-1680×1050.jpg
340. 340 http://files.smashingmagazine.com/wallpapers/aug-17/la-tomatina-festival/nocal/aug-17-la-tomatina-festival-nocal-1680×1200.jpg
341. 341 http://files.smashingmagazine.com/wallpapers/aug-17/la-tomatina-festival/nocal/aug-17-la-tomatina-festival-nocal-1920×1080.jpg
342. 342 http://files.smashingmagazine.com/wallpapers/aug-17/la-tomatina-festival/nocal/aug-17-la-tomatina-festival-nocal-1920×1200.jpg
343. 343 http://files.smashingmagazine.com/wallpapers/aug-17/la-tomatina-festival/nocal/aug-17-la-tomatina-festival-nocal-1920×1440.jpg
344. 344 http://files.smashingmagazine.com/wallpapers/aug-17/la-tomatina-festival/nocal/aug-17-la-tomatina-festival-nocal-2560×1440.jpg
345. 345 http://www.sennemommens.com
346. 346 http://files.smashingmagazine.com/wallpapers/aug-17/on-the-road/aug-17-on-the-road-full.png
347. 347 http://files.smashingmagazine.com/wallpapers/aug-17/on-the-road/aug-17-on-the-road-preview.png
348. 348 http://files.smashingmagazine.com/wallpapers/aug-17/on-the-road/cal/aug-17-on-the-road-cal-320×480.png
349. 349 http://files.smashingmagazine.com/wallpapers/aug-17/on-the-road/cal/aug-17-on-the-road-cal-1280×720.png
350. 350 http://files.smashingmagazine.com/wallpapers/aug-17/on-the-road/cal/aug-17-on-the-road-cal-1280×800.png
351. 351 http://files.smashingmagazine.com/wallpapers/aug-17/on-the-road/cal/aug-17-on-the-road-cal-1280×1024.png
352. 352 http://files.smashingmagazine.com/wallpapers/aug-17/on-the-road/cal/aug-17-on-the-road-cal-1920×1080.png
353. 353 http://files.smashingmagazine.com/wallpapers/aug-17/on-the-road/cal/aug-17-on-the-road-cal-2560×1440.png
354. 354 http://files.smashingmagazine.com/wallpapers/aug-17/on-the-road/nocal/aug-17-on-the-road-nocal-320×480.png
355. 355 http://files.smashingmagazine.com/wallpapers/aug-17/on-the-road/nocal/aug-17-on-the-road-nocal-1280×720.png
356. 356 http://files.smashingmagazine.com/wallpapers/aug-17/on-the-road/nocal/aug-17-on-the-road-nocal-1280×800.png
357. 357 http://files.smashingmagazine.com/wallpapers/aug-17/on-the-road/nocal/aug-17-on-the-road-nocal-1280×1024.png
358. 358 http://files.smashingmagazine.com/wallpapers/aug-17/on-the-road/nocal/aug-17-on-the-road-nocal-1920×1080.png
359. 359 http://files.smashingmagazine.com/wallpapers/aug-17/on-the-road/nocal/aug-17-on-the-road-nocal-2560×1440.png
360. 360 http://www.tazi.com.au
361. 361 http://files.smashingmagazine.com/wallpapers/aug-17/hello-again/aug-17-hello-again-full.png
362. 362 http://files.smashingmagazine.com/wallpapers/aug-17/hello-again/aug-17-hello-again-preview.png
363. 363 http://files.smashingmagazine.com/wallpapers/aug-17/hello-again/cal/aug-17-hello-again-cal-320×480.png
364. 364 http://files.smashingmagazine.com/wallpapers/aug-17/hello-again/cal/aug-17-hello-again-cal-640×480.png
365. 365 http://files.smashingmagazine.com/wallpapers/aug-17/hello-again/cal/aug-17-hello-again-cal-800×600.png
366. 366 http://files.smashingmagazine.com/wallpapers/aug-17/hello-again/cal/aug-17-hello-again-cal-1024×768.png
367. 367 http://files.smashingmagazine.com/wallpapers/aug-17/hello-again/cal/aug-17-hello-again-cal-1152×864.png
368. 368 http://files.smashingmagazine.com/wallpapers/aug-17/hello-again/cal/aug-17-hello-again-cal-1280×720.png
369. 369 http://files.smashingmagazine.com/wallpapers/aug-17/hello-again/cal/aug-17-hello-again-cal-1280×960.png
370. 370 http://files.smashingmagazine.com/wallpapers/aug-17/hello-again/cal/aug-17-hello-again-cal-1600×1200.png
371. 371 http://files.smashingmagazine.com/wallpapers/aug-17/hello-again/cal/aug-17-hello-again-cal-1920×1080.png
372. 372 http://files.smashingmagazine.com/wallpapers/aug-17/hello-again/cal/aug-17-hello-again-cal-1920×1440.png
373. 373 http://files.smashingmagazine.com/wallpapers/aug-17/hello-again/cal/aug-17-hello-again-cal-2560×1440.png
374. 374 http://files.smashingmagazine.com/wallpapers/aug-17/hello-again/nocal/aug-17-hello-again-nocal-320×480.png
375. 375 http://files.smashingmagazine.com/wallpapers/aug-17/hello-again/nocal/aug-17-hello-again-nocal-640×480.png
376. 376 http://files.smashingmagazine.com/wallpapers/aug-17/hello-again/nocal/aug-17-hello-again-nocal-800×600.png
377. 377 http://files.smashingmagazine.com/wallpapers/aug-17/hello-again/nocal/aug-17-hello-again-nocal-1024×768.png
378. 378 http://files.smashingmagazine.com/wallpapers/aug-17/hello-again/nocal/aug-17-hello-again-nocal-1152×864.png
379. 379 http://files.smashingmagazine.com/wallpapers/aug-17/hello-again/nocal/aug-17-hello-again-nocal-1280×720.png
380. 380 http://files.smashingmagazine.com/wallpapers/aug-17/hello-again/nocal/aug-17-hello-again-nocal-1280×960.png
381. 381 http://files.smashingmagazine.com/wallpapers/aug-17/hello-again/nocal/aug-17-hello-again-nocal-1600×1200.png
382. 382 http://files.smashingmagazine.com/wallpapers/aug-17/hello-again/nocal/aug-17-hello-again-nocal-1920×1080.png
383. 383 http://files.smashingmagazine.com/wallpapers/aug-17/hello-again/nocal/aug-17-hello-again-nocal-1920×1440.png
384. 384 http://files.smashingmagazine.com/wallpapers/aug-17/hello-again/nocal/aug-17-hello-again-nocal-2560×1440.png
385. 385 http://acodez.in/
386. 386 http://files.smashingmagazine.com/wallpapers/aug-17/let-us-save-the-tigers/aug-17-let-us-save-the-tigers-full.png
387. 387 http://files.smashingmagazine.com/wallpapers/aug-17/let-us-save-the-tigers/aug-17-let-us-save-the-tigers-preview.png
388. 388 http://files.smashingmagazine.com/wallpapers/aug-17/let-us-save-the-tigers/cal/aug-17-let-us-save-the-tigers-cal-320×480.png
389. 389 http://files.smashingmagazine.com/wallpapers/aug-17/let-us-save-the-tigers/cal/aug-17-let-us-save-the-tigers-cal-640×480.png
390. 390 http://files.smashingmagazine.com/wallpapers/aug-17/let-us-save-the-tigers/cal/aug-17-let-us-save-the-tigers-cal-800×480.png
391. 391 http://files.smashingmagazine.com/wallpapers/aug-17/let-us-save-the-tigers/cal/aug-17-let-us-save-the-tigers-cal-800×600.png
392. 392 http://files.smashingmagazine.com/wallpapers/aug-17/let-us-save-the-tigers/cal/aug-17-let-us-save-the-tigers-cal-1024×768.png
393. 393 http://files.smashingmagazine.com/wallpapers/aug-17/let-us-save-the-tigers/cal/aug-17-let-us-save-the-tigers-cal-1024×1024.png
394. 394 http://files.smashingmagazine.com/wallpapers/aug-17/let-us-save-the-tigers/cal/aug-17-let-us-save-the-tigers-cal-1152×864.png
395. 395 http://files.smashingmagazine.com/wallpapers/aug-17/let-us-save-the-tigers/cal/aug-17-let-us-save-the-tigers-cal-1280×720.png
396. 396 http://files.smashingmagazine.com/wallpapers/aug-17/let-us-save-the-tigers/cal/aug-17-let-us-save-the-tigers-cal-1280×800.png
397. 397 http://files.smashingmagazine.com/wallpapers/aug-17/let-us-save-the-tigers/cal/aug-17-let-us-save-the-tigers-cal-1280×960.png
398. 398 http://files.smashingmagazine.com/wallpapers/aug-17/let-us-save-the-tigers/cal/aug-17-let-us-save-the-tigers-cal-1280×1024.png
399. 399 http://files.smashingmagazine.com/wallpapers/aug-17/let-us-save-the-tigers/cal/aug-17-let-us-save-the-tigers-cal-1366×768.png
400. 400 http://files.smashingmagazine.com/wallpapers/aug-17/let-us-save-the-tigers/cal/aug-17-let-us-save-the-tigers-cal-1400×1050.png
401. 401 http://files.smashingmagazine.com/wallpapers/aug-17/let-us-save-the-tigers/cal/aug-17-let-us-save-the-tigers-cal-1440×900.png
402. 402 http://files.smashingmagazine.com/wallpapers/aug-17/let-us-save-the-tigers/cal/aug-17-let-us-save-the-tigers-cal-1600×1200.png
403. 403 http://files.smashingmagazine.com/wallpapers/aug-17/let-us-save-the-tigers/cal/aug-17-let-us-save-the-tigers-cal-1680×1050.png
404. 404 http://files.smashingmagazine.com/wallpapers/aug-17/let-us-save-the-tigers/cal/aug-17-let-us-save-the-tigers-cal-1680×1200.png
405. 405 http://files.smashingmagazine.com/wallpapers/aug-17/let-us-save-the-tigers/cal/aug-17-let-us-save-the-tigers-cal-1920×1080.png
406. 406 http://files.smashingmagazine.com/wallpapers/aug-17/let-us-save-the-tigers/cal/aug-17-let-us-save-the-tigers-cal-1920×1200.png
407. 407 http://files.smashingmagazine.com/wallpapers/aug-17/let-us-save-the-tigers/cal/aug-17-let-us-save-the-tigers-cal-1920×1440.png
408. 408 http://files.smashingmagazine.com/wallpapers/aug-17/let-us-save-the-tigers/cal/aug-17-let-us-save-the-tigers-cal-2560×1440.png
409. 409 http://files.smashingmagazine.com/wallpapers/aug-17/let-us-save-the-tigers/nocal/aug-17-let-us-save-the-tigers-nocal-320×480.png
410. 410 http://files.smashingmagazine.com/wallpapers/aug-17/let-us-save-the-tigers/nocal/aug-17-let-us-save-the-tigers-nocal-640×480.png
411. 411 http://files.smashingmagazine.com/wallpapers/aug-17/let-us-save-the-tigers/nocal/aug-17-let-us-save-the-tigers-nocal-800×480.png
412. 412 http://files.smashingmagazine.com/wallpapers/aug-17/let-us-save-the-tigers/nocal/aug-17-let-us-save-the-tigers-nocal-800×600.png
413. 413 http://files.smashingmagazine.com/wallpapers/aug-17/let-us-save-the-tigers/nocal/aug-17-let-us-save-the-tigers-nocal-1024×768.png
414. 414 http://files.smashingmagazine.com/wallpapers/aug-17/let-us-save-the-tigers/nocal/aug-17-let-us-save-the-tigers-nocal-1024×1024.png
415. 415 http://files.smashingmagazine.com/wallpapers/aug-17/let-us-save-the-tigers/nocal/aug-17-let-us-save-the-tigers-nocal-1152×864.png
416. 416 http://files.smashingmagazine.com/wallpapers/aug-17/let-us-save-the-tigers/nocal/aug-17-let-us-save-the-tigers-nocal-1280×720.png
417. 417 http://files.smashingmagazine.com/wallpapers/aug-17/let-us-save-the-tigers/nocal/aug-17-let-us-save-the-tigers-nocal-1280×800.png
418. 418 http://files.smashingmagazine.com/wallpapers/aug-17/let-us-save-the-tigers/nocal/aug-17-let-us-save-the-tigers-nocal-1280×960.png
419. 419 http://files.smashingmagazine.com/wallpapers/aug-17/let-us-save-the-tigers/nocal/aug-17-let-us-save-the-tigers-nocal-1280×1024.png
420. 420 http://files.smashingmagazine.com/wallpapers/aug-17/let-us-save-the-tigers/nocal/aug-17-let-us-save-the-tigers-nocal-1366×768.png
421. 421 http://files.smashingmagazine.com/wallpapers/aug-17/let-us-save-the-tigers/nocal/aug-17-let-us-save-the-tigers-nocal-1400×1050.png
422. 422 http://files.smashingmagazine.com/wallpapers/aug-17/let-us-save-the-tigers/nocal/aug-17-let-us-save-the-tigers-nocal-1440×900.png
423. 423 http://files.smashingmagazine.com/wallpapers/aug-17/let-us-save-the-tigers/nocal/aug-17-let-us-save-the-tigers-nocal-1600×1200.png
424. 424 http://files.smashingmagazine.com/wallpapers/aug-17/let-us-save-the-tigers/nocal/aug-17-let-us-save-the-tigers-nocal-1680×1050.png
425. 425 http://files.smashingmagazine.com/wallpapers/aug-17/let-us-save-the-tigers/nocal/aug-17-let-us-save-the-tigers-nocal-1680×1200.png
426. 426 http://files.smashingmagazine.com/wallpapers/aug-17/let-us-save-the-tigers/nocal/aug-17-let-us-save-the-tigers-nocal-1920×1080.png
427. 427 http://files.smashingmagazine.com/wallpapers/aug-17/let-us-save-the-tigers/nocal/aug-17-let-us-save-the-tigers-nocal-1920×1200.png
428. 428 http://files.smashingmagazine.com/wallpapers/aug-17/let-us-save-the-tigers/nocal/aug-17-let-us-save-the-tigers-nocal-1920×1440.png
429. 429 http://files.smashingmagazine.com/wallpapers/aug-17/let-us-save-the-tigers/nocal/aug-17-let-us-save-the-tigers-nocal-2560×1440.png
430. 430 https://www.behance.net/jamesmitchell23
431. 431 http://files.smashingmagazine.com/wallpapers/aug-17/launch/aug-17-launch-full.png
432. 432 http://files.smashingmagazine.com/wallpapers/aug-17/launch/aug-17-launch-preview.png
433. 433 http://files.smashingmagazine.com/wallpapers/aug-17/launch/cal/aug-17-launch-cal-1280×720.png
434. 434 http://files.smashingmagazine.com/wallpapers/aug-17/launch/cal/aug-17-launch-cal-1280×800.png
435. 435 http://files.smashingmagazine.com/wallpapers/aug-17/launch/cal/aug-17-launch-cal-1366×768.png
436. 436 http://files.smashingmagazine.com/wallpapers/aug-17/launch/cal/aug-17-launch-cal-1440×900.png
437. 437 http://files.smashingmagazine.com/wallpapers/aug-17/launch/cal/aug-17-launch-cal-1680×1050.png
438. 438 http://files.smashingmagazine.com/wallpapers/aug-17/launch/cal/aug-17-launch-cal-1920×1080.png
439. 439 http://files.smashingmagazine.com/wallpapers/aug-17/launch/cal/aug-17-launch-cal-1920×1200.png
440. 440 http://files.smashingmagazine.com/wallpapers/aug-17/launch/cal/aug-17-launch-cal-2560×1440.png
441. 441 http://files.smashingmagazine.com/wallpapers/aug-17/launch/cal/aug-17-launch-cal-2880×1800.png
442. 442 http://files.smashingmagazine.com/wallpapers/aug-17/launch/nocal/aug-17-launch-nocal-1280×720.png
443. 443 http://files.smashingmagazine.com/wallpapers/aug-17/launch/nocal/aug-17-launch-nocal-1280×800.png
444. 444 http://files.smashingmagazine.com/wallpapers/aug-17/launch/nocal/aug-17-launch-nocal-1366×768.png
445. 445 http://files.smashingmagazine.com/wallpapers/aug-17/launch/nocal/aug-17-launch-nocal-1440×900.png
446. 446 http://files.smashingmagazine.com/wallpapers/aug-17/launch/nocal/aug-17-launch-nocal-1680×1050.png
447. 447 http://files.smashingmagazine.com/wallpapers/aug-17/launch/nocal/aug-17-launch-nocal-1920×1080.png
448. 448 http://files.smashingmagazine.com/wallpapers/aug-17/launch/nocal/aug-17-launch-nocal-1920×1200.png
449. 449 http://files.smashingmagazine.com/wallpapers/aug-17/launch/nocal/aug-17-launch-nocal-2560×1440.png
450. 450 http://files.smashingmagazine.com/wallpapers/aug-17/launch/nocal/aug-17-launch-nocal-2880×1800.png
451. 451 https://www.sweans.com
452. 452 http://files.smashingmagazine.com/wallpapers/aug-17/be-brave-to-meet-it-in-your-style/aug-17-be-brave-to-meet-it-in-your-style-full.jpg
453. 453 http://files.smashingmagazine.com/wallpapers/aug-17/be-brave-to-meet-it-in-your-style/aug-17-be-brave-to-meet-it-in-your-style-preview.jpg
454. 454 http://files.smashingmagazine.com/wallpapers/aug-17/be-brave-to-meet-it-in-your-style/cal/aug-17-be-brave-to-meet-it-in-your-style-cal-320×480.jpg
455. 455 http://files.smashingmagazine.com/wallpapers/aug-17/be-brave-to-meet-it-in-your-style/cal/aug-17-be-brave-to-meet-it-in-your-style-cal-640×480.jpg
456. 456 http://files.smashingmagazine.com/wallpapers/aug-17/be-brave-to-meet-it-in-your-style/cal/aug-17-be-brave-to-meet-it-in-your-style-cal-800×480.jpg
457. 457 http://files.smashingmagazine.com/wallpapers/aug-17/be-brave-to-meet-it-in-your-style/cal/aug-17-be-brave-to-meet-it-in-your-style-cal-800×600.jpg
458. 458 http://files.smashingmagazine.com/wallpapers/aug-17/be-brave-to-meet-it-in-your-style/cal/aug-17-be-brave-to-meet-it-in-your-style-cal-1024×768.jpg
459. 459 http://files.smashingmagazine.com/wallpapers/aug-17/be-brave-to-meet-it-in-your-style/cal/aug-17-be-brave-to-meet-it-in-your-style-cal-1024×1024.jpg
460. 460 http://files.smashingmagazine.com/wallpapers/aug-17/be-brave-to-meet-it-in-your-style/cal/aug-17-be-brave-to-meet-it-in-your-style-cal-1152×864.jpg
461. 461 http://files.smashingmagazine.com/wallpapers/aug-17/be-brave-to-meet-it-in-your-style/cal/aug-17-be-brave-to-meet-it-in-your-style-cal-1280×720.jpg
462. 462 http://files.smashingmagazine.com/wallpapers/aug-17/be-brave-to-meet-it-in-your-style/cal/aug-17-be-brave-to-meet-it-in-your-style-cal-1280×800.jpg
463. 463 http://files.smashingmagazine.com/wallpapers/aug-17/be-brave-to-meet-it-in-your-style/cal/aug-17-be-brave-to-meet-it-in-your-style-cal-1280×960.jpg
464. 464 http://files.smashingmagazine.com/wallpapers/aug-17/be-brave-to-meet-it-in-your-style/cal/aug-17-be-brave-to-meet-it-in-your-style-cal-1280×1024.jpg
465. 465 http://files.smashingmagazine.com/wallpapers/aug-17/be-brave-to-meet-it-in-your-style/cal/aug-17-be-brave-to-meet-it-in-your-style-cal-1366×768.jpg
466. 466 http://files.smashingmagazine.com/wallpapers/aug-17/be-brave-to-meet-it-in-your-style/cal/aug-17-be-brave-to-meet-it-in-your-style-cal-1400×1050.jpg
467. 467 http://files.smashingmagazine.com/wallpapers/aug-17/be-brave-to-meet-it-in-your-style/cal/aug-17-be-brave-to-meet-it-in-your-style-cal-1440×900.jpg
468. 468 http://files.smashingmagazine.com/wallpapers/aug-17/be-brave-to-meet-it-in-your-style/cal/aug-17-be-brave-to-meet-it-in-your-style-cal-1600×1200.jpg
469. 469 http://files.smashingmagazine.com/wallpapers/aug-17/be-brave-to-meet-it-in-your-style/cal/aug-17-be-brave-to-meet-it-in-your-style-cal-1680×1050.jpg
470. 470 http://files.smashingmagazine.com/wallpapers/aug-17/be-brave-to-meet-it-in-your-style/cal/aug-17-be-brave-to-meet-it-in-your-style-cal-1680×1200.jpg
471. 471 http://files.smashingmagazine.com/wallpapers/aug-17/be-brave-to-meet-it-in-your-style/cal/aug-17-be-brave-to-meet-it-in-your-style-cal-1920×1080.jpg
472. 472 http://files.smashingmagazine.com/wallpapers/aug-17/be-brave-to-meet-it-in-your-style/cal/aug-17-be-brave-to-meet-it-in-your-style-cal-1920×1200.jpg
473. 473 http://files.smashingmagazine.com/wallpapers/aug-17/be-brave-to-meet-it-in-your-style/cal/aug-17-be-brave-to-meet-it-in-your-style-cal-1920×1440.jpg
474. 474 http://files.smashingmagazine.com/wallpapers/aug-17/be-brave-to-meet-it-in-your-style/cal/aug-17-be-brave-to-meet-it-in-your-style-cal-2560×1440.jpg
475. 475 http://files.smashingmagazine.com/wallpapers/aug-17/be-brave-to-meet-it-in-your-style/nocal/aug-17-be-brave-to-meet-it-in-your-style-nocal-320×480.jpg
476. 476 http://files.smashingmagazine.com/wallpapers/aug-17/be-brave-to-meet-it-in-your-style/nocal/aug-17-be-brave-to-meet-it-in-your-style-nocal-640×480.jpg
477. 477 http://files.smashingmagazine.com/wallpapers/aug-17/be-brave-to-meet-it-in-your-style/nocal/aug-17-be-brave-to-meet-it-in-your-style-nocal-800×480.jpg
478. 478 http://files.smashingmagazine.com/wallpapers/aug-17/be-brave-to-meet-it-in-your-style/nocal/aug-17-be-brave-to-meet-it-in-your-style-nocal-800×600.jpg
479. 479 http://files.smashingmagazine.com/wallpapers/aug-17/be-brave-to-meet-it-in-your-style/nocal/aug-17-be-brave-to-meet-it-in-your-style-nocal-1024×768.jpg
480. 480 http://files.smashingmagazine.com/wallpapers/aug-17/be-brave-to-meet-it-in-your-style/nocal/aug-17-be-brave-to-meet-it-in-your-style-nocal-1024×1024.jpg
481. 481 http://files.smashingmagazine.com/wallpapers/aug-17/be-brave-to-meet-it-in-your-style/nocal/aug-17-be-brave-to-meet-it-in-your-style-nocal-1152×864.jpg
482. 482 http://files.smashingmagazine.com/wallpapers/aug-17/be-brave-to-meet-it-in-your-style/nocal/aug-17-be-brave-to-meet-it-in-your-style-nocal-1280×720.jpg
483. 483 http://files.smashingmagazine.com/wallpapers/aug-17/be-brave-to-meet-it-in-your-style/nocal/aug-17-be-brave-to-meet-it-in-your-style-nocal-1280×800.jpg
484. 484 http://files.smashingmagazine.com/wallpapers/aug-17/be-brave-to-meet-it-in-your-style/nocal/aug-17-be-brave-to-meet-it-in-your-style-nocal-1280×960.jpg
485. 485 http://files.smashingmagazine.com/wallpapers/aug-17/be-brave-to-meet-it-in-your-style/nocal/aug-17-be-brave-to-meet-it-in-your-style-nocal-1280×1024.jpg
486. 486 http://files.smashingmagazine.com/wallpapers/aug-17/be-brave-to-meet-it-in-your-style/nocal/aug-17-be-brave-to-meet-it-in-your-style-nocal-1366×768.jpg
487. 487 http://files.smashingmagazine.com/wallpapers/aug-17/be-brave-to-meet-it-in-your-style/nocal/aug-17-be-brave-to-meet-it-in-your-style-nocal-1400×1050.jpg
488. 488 http://files.smashingmagazine.com/wallpapers/aug-17/be-brave-to-meet-it-in-your-style/nocal/aug-17-be-brave-to-meet-it-in-your-style-nocal-1440×900.jpg
489. 489 http://files.smashingmagazine.com/wallpapers/aug-17/be-brave-to-meet-it-in-your-style/nocal/aug-17-be-brave-to-meet-it-in-your-style-nocal-1600×1200.jpg
490. 490 http://files.smashingmagazine.com/wallpapers/aug-17/be-brave-to-meet-it-in-your-style/nocal/aug-17-be-brave-to-meet-it-in-your-style-nocal-1680×1050.jpg
491. 491 http://files.smashingmagazine.com/wallpapers/aug-17/be-brave-to-meet-it-in-your-style/nocal/aug-17-be-brave-to-meet-it-in-your-style-nocal-1680×1200.jpg
492. 492 http://files.smashingmagazine.com/wallpapers/aug-17/be-brave-to-meet-it-in-your-style/nocal/aug-17-be-brave-to-meet-it-in-your-style-nocal-1920×1080.jpg
493. 493 http://files.smashingmagazine.com/wallpapers/aug-17/be-brave-to-meet-it-in-your-style/nocal/aug-17-be-brave-to-meet-it-in-your-style-nocal-1920×1200.jpg
494. 494 http://files.smashingmagazine.com/wallpapers/aug-17/be-brave-to-meet-it-in-your-style/nocal/aug-17-be-brave-to-meet-it-in-your-style-nocal-1920×1440.jpg
495. 495 http://files.smashingmagazine.com/wallpapers/aug-17/be-brave-to-meet-it-in-your-style/nocal/aug-17-be-brave-to-meet-it-in-your-style-nocal-2560×1440.jpg
496. 496 http://arevadigital.in/
497. 497 http://files.smashingmagazine.com/wallpapers/aug-17/where-words-fail-pictures-come-into-action/aug-17-where-words-fail-pictures-come-into-action-full.png
498. 498 http://files.smashingmagazine.com/wallpapers/aug-17/where-words-fail-pictures-come-into-action/aug-17-where-words-fail-pictures-come-into-action-preview.png
499. 499 http://files.smashingmagazine.com/wallpapers/aug-17/where-words-fail-pictures-come-into-action/cal/aug-17-where-words-fail-pictures-come-into-action-cal-320×480.png
500. 500 http://files.smashingmagazine.com/wallpapers/aug-17/where-words-fail-pictures-come-into-action/cal/aug-17-where-words-fail-pictures-come-into-action-cal-640×480.png
501. 501 http://files.smashingmagazine.com/wallpapers/aug-17/where-words-fail-pictures-come-into-action/cal/aug-17-where-words-fail-pictures-come-into-action-cal-800×480.png
502. 502 http://files.smashingmagazine.com/wallpapers/aug-17/where-words-fail-pictures-come-into-action/cal/aug-17-where-words-fail-pictures-come-into-action-cal-800×600.png
503. 503 http://files.smashingmagazine.com/wallpapers/aug-17/where-words-fail-pictures-come-into-action/cal/aug-17-where-words-fail-pictures-come-into-action-cal-1024×768.png
504. 504 http://files.smashingmagazine.com/wallpapers/aug-17/where-words-fail-pictures-come-into-action/cal/aug-17-where-words-fail-pictures-come-into-action-cal-1024×1024.png
505. 505 http://files.smashingmagazine.com/wallpapers/aug-17/where-words-fail-pictures-come-into-action/cal/aug-17-where-words-fail-pictures-come-into-action-cal-1152×864.png
506. 506 http://files.smashingmagazine.com/wallpapers/aug-17/where-words-fail-pictures-come-into-action/cal/aug-17-where-words-fail-pictures-come-into-action-cal-1280×720.png
507. 507 http://files.smashingmagazine.com/wallpapers/aug-17/where-words-fail-pictures-come-into-action/cal/aug-17-where-words-fail-pictures-come-into-action-cal-1280×960.png
508. 508 http://files.smashingmagazine.com/wallpapers/aug-17/where-words-fail-pictures-come-into-action/cal/aug-17-where-words-fail-pictures-come-into-action-cal-1280×1024.png
509. 509 http://files.smashingmagazine.com/wallpapers/aug-17/where-words-fail-pictures-come-into-action/cal/aug-17-where-words-fail-pictures-come-into-action-cal-1366×768.png
510. 510 http://files.smashingmagazine.com/wallpapers/aug-17/where-words-fail-pictures-come-into-action/cal/aug-17-where-words-fail-pictures-come-into-action-cal-1400×1050.png
511. 511 http://files.smashingmagazine.com/wallpapers/aug-17/where-words-fail-pictures-come-into-action/cal/aug-17-where-words-fail-pictures-come-into-action-cal-1440×900.png
512. 512 http://files.smashingmagazine.com/wallpapers/aug-17/where-words-fail-pictures-come-into-action/cal/aug-17-where-words-fail-pictures-come-into-action-cal-1600×1200.png
513. 513 http://files.smashingmagazine.com/wallpapers/aug-17/where-words-fail-pictures-come-into-action/cal/aug-17-where-words-fail-pictures-come-into-action-cal-1680×1050.png
514. 514 http://files.smashingmagazine.com/wallpapers/aug-17/where-words-fail-pictures-come-into-action/cal/aug-17-where-words-fail-pictures-come-into-action-cal-1920×1080.png
515. 515 http://files.smashingmagazine.com/wallpapers/aug-17/where-words-fail-pictures-come-into-action/cal/aug-17-where-words-fail-pictures-come-into-action-cal-1920×1200.png
516. 516 http://files.smashingmagazine.com/wallpapers/aug-17/where-words-fail-pictures-come-into-action/cal/aug-17-where-words-fail-pictures-come-into-action-cal-1920×1440.png
517. 517 http://files.smashingmagazine.com/wallpapers/aug-17/where-words-fail-pictures-come-into-action/cal/aug-17-where-words-fail-pictures-come-into-action-cal-2560×1440.png
518. 518 http://files.smashingmagazine.com/wallpapers/aug-17/where-words-fail-pictures-come-into-action/nocal/aug-17-where-words-fail-pictures-come-into-action-nocal-320×480.png
519. 519 http://files.smashingmagazine.com/wallpapers/aug-17/where-words-fail-pictures-come-into-action/nocal/aug-17-where-words-fail-pictures-come-into-action-nocal-640×480.png
520. 520 http://files.smashingmagazine.com/wallpapers/aug-17/where-words-fail-pictures-come-into-action/nocal/aug-17-where-words-fail-pictures-come-into-action-nocal-800×480.png
521. 521 http://files.smashingmagazine.com/wallpapers/aug-17/where-words-fail-pictures-come-into-action/nocal/aug-17-where-words-fail-pictures-come-into-action-nocal-800×600.png
522. 522 http://files.smashingmagazine.com/wallpapers/aug-17/where-words-fail-pictures-come-into-action/nocal/aug-17-where-words-fail-pictures-come-into-action-nocal-1024×768.png
523. 523 http://files.smashingmagazine.com/wallpapers/aug-17/where-words-fail-pictures-come-into-action/nocal/aug-17-where-words-fail-pictures-come-into-action-nocal-1024×1024.png
524. 524 http://files.smashingmagazine.com/wallpapers/aug-17/where-words-fail-pictures-come-into-action/nocal/aug-17-where-words-fail-pictures-come-into-action-nocal-1152×864.png
525. 525 http://files.smashingmagazine.com/wallpapers/aug-17/where-words-fail-pictures-come-into-action/nocal/aug-17-where-words-fail-pictures-come-into-action-nocal-1280×720.png
526. 526 http://files.smashingmagazine.com/wallpapers/aug-17/where-words-fail-pictures-come-into-action/nocal/aug-17-where-words-fail-pictures-come-into-action-nocal-1280×960.png
527. 527 http://files.smashingmagazine.com/wallpapers/aug-17/where-words-fail-pictures-come-into-action/nocal/aug-17-where-words-fail-pictures-come-into-action-nocal-1280×1024.png
528. 528 http://files.smashingmagazine.com/wallpapers/aug-17/where-words-fail-pictures-come-into-action/nocal/aug-17-where-words-fail-pictures-come-into-action-nocal-1366×768.png
529. 529 http://files.smashingmagazine.com/wallpapers/aug-17/where-words-fail-pictures-come-into-action/nocal/aug-17-where-words-fail-pictures-come-into-action-nocal-1400×1050.png
530. 530 http://files.smashingmagazine.com/wallpapers/aug-17/where-words-fail-pictures-come-into-action/nocal/aug-17-where-words-fail-pictures-come-into-action-nocal-1440×900.png
531. 531 http://files.smashingmagazine.com/wallpapers/aug-17/where-words-fail-pictures-come-into-action/nocal/aug-17-where-words-fail-pictures-come-into-action-nocal-1600×1200.png
532. 532 http://files.smashingmagazine.com/wallpapers/aug-17/where-words-fail-pictures-come-into-action/nocal/aug-17-where-words-fail-pictures-come-into-action-nocal-1680×1050.png
533. 533 http://files.smashingmagazine.com/wallpapers/aug-17/where-words-fail-pictures-come-into-action/nocal/aug-17-where-words-fail-pictures-come-into-action-nocal-1920×1080.png
534. 534 http://files.smashingmagazine.com/wallpapers/aug-17/where-words-fail-pictures-come-into-action/nocal/aug-17-where-words-fail-pictures-come-into-action-nocal-1920×1200.png
535. 535 http://files.smashingmagazine.com/wallpapers/aug-17/where-words-fail-pictures-come-into-action/nocal/aug-17-where-words-fail-pictures-come-into-action-nocal-1920×1440.png
536. 536 http://files.smashingmagazine.com/wallpapers/aug-17/where-words-fail-pictures-come-into-action/nocal/aug-17-where-words-fail-pictures-come-into-action-nocal-2560×1440.png
537. 537 https://pixiv.me/sunday1216
538. 538 http://files.smashingmagazine.com/wallpapers/aug-17/liqiu-and-orange-daylily-season/aug-17-liqiu-and-orange-daylily-season-full.png
539. 539 http://files.smashingmagazine.com/wallpapers/aug-17/liqiu-and-orange-daylily-season/aug-17-liqiu-and-orange-daylily-season-preview.png
540. 540 http://files.smashingmagazine.com/wallpapers/aug-17/liqiu-and-orange-daylily-season/cal/aug-17-liqiu-and-orange-daylily-season-cal-1024×768.png
541. 541 http://files.smashingmagazine.com/wallpapers/aug-17/liqiu-and-orange-daylily-season/cal/aug-17-liqiu-and-orange-daylily-season-cal-1080×1920.png
542. 542 http://files.smashingmagazine.com/wallpapers/aug-17/liqiu-and-orange-daylily-season/cal/aug-17-liqiu-and-orange-daylily-season-cal-1280×720.png
543. 543 http://files.smashingmagazine.com/wallpapers/aug-17/liqiu-and-orange-daylily-season/cal/aug-17-liqiu-and-orange-daylily-season-cal-1280×960.png
544. 544 http://files.smashingmagazine.com/wallpapers/aug-17/liqiu-and-orange-daylily-season/cal/aug-17-liqiu-and-orange-daylily-season-cal-1280×1024.png
545. 545 http://files.smashingmagazine.com/wallpapers/aug-17/liqiu-and-orange-daylily-season/cal/aug-17-liqiu-and-orange-daylily-season-cal-1366×768.png
546. 546 http://files.smashingmagazine.com/wallpapers/aug-17/liqiu-and-orange-daylily-season/cal/aug-17-liqiu-and-orange-daylily-season-cal-1920×1080.png
547. 547 http://files.smashingmagazine.com/wallpapers/aug-17/liqiu-and-orange-daylily-season/cal/aug-17-liqiu-and-orange-daylily-season-cal-2560×1440.png
548. 548 http://files.smashingmagazine.com/wallpapers/aug-17/liqiu-and-orange-daylily-season/nocal/aug-17-liqiu-and-orange-daylily-season-nocal-1024×768.png
549. 549 http://files.smashingmagazine.com/wallpapers/aug-17/liqiu-and-orange-daylily-season/nocal/aug-17-liqiu-and-orange-daylily-season-nocal-1080×1920.png
550. 550 http://files.smashingmagazine.com/wallpapers/aug-17/liqiu-and-orange-daylily-season/nocal/aug-17-liqiu-and-orange-daylily-season-nocal-1280×720.png
551. 551 http://files.smashingmagazine.com/wallpapers/aug-17/liqiu-and-orange-daylily-season/nocal/aug-17-liqiu-and-orange-daylily-season-nocal-1280×960.png
552. 552 http://files.smashingmagazine.com/wallpapers/aug-17/liqiu-and-orange-daylily-season/nocal/aug-17-liqiu-and-orange-daylily-season-nocal-1280×1024.png
553. 553 http://files.smashingmagazine.com/wallpapers/aug-17/liqiu-and-orange-daylily-season/nocal/aug-17-liqiu-and-orange-daylily-season-nocal-1366×768.png
554. 554 http://files.smashingmagazine.com/wallpapers/aug-17/liqiu-and-orange-daylily-season/nocal/aug-17-liqiu-and-orange-daylily-season-nocal-1920×1080.png
555. 555 http://files.smashingmagazine.com/wallpapers/aug-17/liqiu-and-orange-daylily-season/nocal/aug-17-liqiu-and-orange-daylily-season-nocal-2560×1440.png
556. 556 http://damnperfect.com
557. 557 http://files.smashingmagazine.com/wallpapers/aug-17/happy-janmashtami/aug-17-happy-janmashtami-full.jpg
558. 558 http://files.smashingmagazine.com/wallpapers/aug-17/happy-janmashtami/aug-17-happy-janmashtami-preview.jpg
559. 559 http://files.smashingmagazine.com/wallpapers/aug-17/happy-janmashtami/cal/aug-17-happy-janmashtami-cal-320×480.jpg
560. 560 http://files.smashingmagazine.com/wallpapers/aug-17/happy-janmashtami/cal/aug-17-happy-janmashtami-cal-640×480.jpg
561. 561 http://files.smashingmagazine.com/wallpapers/aug-17/happy-janmashtami/cal/aug-17-happy-janmashtami-cal-800×480.jpg
562. 562 http://files.smashingmagazine.com/wallpapers/aug-17/happy-janmashtami/cal/aug-17-happy-janmashtami-cal-800×600.jpg
563. 563 http://files.smashingmagazine.com/wallpapers/aug-17/happy-janmashtami/cal/aug-17-happy-janmashtami-cal-1024×768.jpg
564. 564 http://files.smashingmagazine.com/wallpapers/aug-17/happy-janmashtami/cal/aug-17-happy-janmashtami-cal-1024×1024.jpg
565. 565 http://files.smashingmagazine.com/wallpapers/aug-17/happy-janmashtami/cal/aug-17-happy-janmashtami-cal-1152×864.jpg
566. 566 http://files.smashingmagazine.com/wallpapers/aug-17/happy-janmashtami/cal/aug-17-happy-janmashtami-cal-1280×720.jpg
567. 567 http://files.smashingmagazine.com/wallpapers/aug-17/happy-janmashtami/cal/aug-17-happy-janmashtami-cal-1280×800.jpg
568. 568 http://files.smashingmagazine.com/wallpapers/aug-17/happy-janmashtami/cal/aug-17-happy-janmashtami-cal-1280×960.jpg
569. 569 http://files.smashingmagazine.com/wallpapers/aug-17/happy-janmashtami/cal/aug-17-happy-janmashtami-cal-1280×1024.jpg
570. 570 http://files.smashingmagazine.com/wallpapers/aug-17/happy-janmashtami/cal/aug-17-happy-janmashtami-cal-1366×768.jpg
571. 571 http://files.smashingmagazine.com/wallpapers/aug-17/happy-janmashtami/cal/aug-17-happy-janmashtami-cal-1400×1050.jpg
572. 572 http://files.smashingmagazine.com/wallpapers/aug-17/happy-janmashtami/cal/aug-17-happy-janmashtami-cal-1440×900.jpg
573. 573 http://files.smashingmagazine.com/wallpapers/aug-17/happy-janmashtami/cal/aug-17-happy-janmashtami-cal-1600×1200.jpg
574. 574 http://files.smashingmagazine.com/wallpapers/aug-17/happy-janmashtami/cal/aug-17-happy-janmashtami-cal-1680×1050.jpg
575. 575 http://files.smashingmagazine.com/wallpapers/aug-17/happy-janmashtami/cal/aug-17-happy-janmashtami-cal-1680×1200.jpg
576. 576 http://files.smashingmagazine.com/wallpapers/aug-17/happy-janmashtami/cal/aug-17-happy-janmashtami-cal-1920×1080.jpg
577. 577 http://files.smashingmagazine.com/wallpapers/aug-17/happy-janmashtami/cal/aug-17-happy-janmashtami-cal-1920×1200.jpg
578. 578 http://files.smashingmagazine.com/wallpapers/aug-17/happy-janmashtami/cal/aug-17-happy-janmashtami-cal-1920×1440.jpg
579. 579 http://files.smashingmagazine.com/wallpapers/aug-17/happy-janmashtami/cal/aug-17-happy-janmashtami-cal-2560×1440.jpg
580. 580 http://files.smashingmagazine.com/wallpapers/aug-17/happy-janmashtami/nocal/aug-17-happy-janmashtami-nocal-320×480.jpg
581. 581 http://files.smashingmagazine.com/wallpapers/aug-17/happy-janmashtami/nocal/aug-17-happy-janmashtami-nocal-640×480.jpg
582. 582 http://files.smashingmagazine.com/wallpapers/aug-17/happy-janmashtami/nocal/aug-17-happy-janmashtami-nocal-800×480.jpg
583. 583 http://files.smashingmagazine.com/wallpapers/aug-17/happy-janmashtami/nocal/aug-17-happy-janmashtami-nocal-800×600.jpg
584. 584 http://files.smashingmagazine.com/wallpapers/aug-17/happy-janmashtami/nocal/aug-17-happy-janmashtami-nocal-1024×768.jpg
585. 585 http://files.smashingmagazine.com/wallpapers/aug-17/happy-janmashtami/nocal/aug-17-happy-janmashtami-nocal-1024×1024.jpg
586. 586 http://files.smashingmagazine.com/wallpapers/aug-17/happy-janmashtami/nocal/aug-17-happy-janmashtami-nocal-1152×864.jpg
587. 587 http://files.smashingmagazine.com/wallpapers/aug-17/happy-janmashtami/nocal/aug-17-happy-janmashtami-nocal-1280×720.jpg
588. 588 http://files.smashingmagazine.com/wallpapers/aug-17/happy-janmashtami/nocal/aug-17-happy-janmashtami-nocal-1280×800.jpg
589. 589 http://files.smashingmagazine.com/wallpapers/aug-17/happy-janmashtami/nocal/aug-17-happy-janmashtami-nocal-1280×960.jpg
590. 590 http://files.smashingmagazine.com/wallpapers/aug-17/happy-janmashtami/nocal/aug-17-happy-janmashtami-nocal-1280×1024.jpg
591. 591 http://files.smashingmagazine.com/wallpapers/aug-17/happy-janmashtami/nocal/aug-17-happy-janmashtami-nocal-1366×768.jpg
592. 592 http://files.smashingmagazine.com/wallpapers/aug-17/happy-janmashtami/nocal/aug-17-happy-janmashtami-nocal-1400×1050.jpg
593. 593 http://files.smashingmagazine.com/wallpapers/aug-17/happy-janmashtami/nocal/aug-17-happy-janmashtami-nocal-1440×900.jpg
594. 594 http://files.smashingmagazine.com/wallpapers/aug-17/happy-janmashtami/nocal/aug-17-happy-janmashtami-nocal-1600×1200.jpg
595. 595 http://files.smashingmagazine.com/wallpapers/aug-17/happy-janmashtami/nocal/aug-17-happy-janmashtami-nocal-1680×1050.jpg
596. 596 http://files.smashingmagazine.com/wallpapers/aug-17/happy-janmashtami/nocal/aug-17-happy-janmashtami-nocal-1680×1200.jpg
597. 597 http://files.smashingmagazine.com/wallpapers/aug-17/happy-janmashtami/nocal/aug-17-happy-janmashtami-nocal-1920×1080.jpg
598. 598 http://files.smashingmagazine.com/wallpapers/aug-17/happy-janmashtami/nocal/aug-17-happy-janmashtami-nocal-1920×1200.jpg
599. 599 http://files.smashingmagazine.com/wallpapers/aug-17/happy-janmashtami/nocal/aug-17-happy-janmashtami-nocal-1920×1440.jpg
600. 600 http://files.smashingmagazine.com/wallpapers/aug-17/happy-janmashtami/nocal/aug-17-happy-janmashtami-nocal-2560×1440.jpg
601. 601 https://www.ipixtechnologies.com/
602. 602 http://files.smashingmagazine.com/wallpapers/aug-17/if-a-mozzie-could-tell-you-a-story/aug-17-if-a-mozzie-could-tell-you-a-story-full.jpg
603. 603 http://files.smashingmagazine.com/wallpapers/aug-17/if-a-mozzie-could-tell-you-a-story/aug-17-if-a-mozzie-could-tell-you-a-story-preview.jpg
604. 604 http://files.smashingmagazine.com/wallpapers/aug-17/if-a-mozzie-could-tell-you-a-story/cal/aug-17-if-a-mozzie-could-tell-you-a-story-cal-320×480.jpg
605. 605 http://files.smashingmagazine.com/wallpapers/aug-17/if-a-mozzie-could-tell-you-a-story/cal/aug-17-if-a-mozzie-could-tell-you-a-story-cal-640×480.jpg
606. 606 http://files.smashingmagazine.com/wallpapers/aug-17/if-a-mozzie-could-tell-you-a-story/cal/aug-17-if-a-mozzie-could-tell-you-a-story-cal-800×600.jpg
607. 607 http://files.smashingmagazine.com/wallpapers/aug-17/if-a-mozzie-could-tell-you-a-story/cal/aug-17-if-a-mozzie-could-tell-you-a-story-cal-1024×768.jpg
608. 608 http://files.smashingmagazine.com/wallpapers/aug-17/if-a-mozzie-could-tell-you-a-story/cal/aug-17-if-a-mozzie-could-tell-you-a-story-cal-1024×1024.jpg
609. 609 http://files.smashingmagazine.com/wallpapers/aug-17/if-a-mozzie-could-tell-you-a-story/cal/aug-17-if-a-mozzie-could-tell-you-a-story-cal-1152×864.jpg
610. 610 http://files.smashingmagazine.com/wallpapers/aug-17/if-a-mozzie-could-tell-you-a-story/cal/aug-17-if-a-mozzie-could-tell-you-a-story-cal-1280×720.jpg
611. 611 http://files.smashingmagazine.com/wallpapers/aug-17/if-a-mozzie-could-tell-you-a-story/cal/aug-17-if-a-mozzie-could-tell-you-a-story-cal-1280×800.jpg
612. 612 http://files.smashingmagazine.com/wallpapers/aug-17/if-a-mozzie-could-tell-you-a-story/cal/aug-17-if-a-mozzie-could-tell-you-a-story-cal-1280×960.jpg
613. 613 http://files.smashingmagazine.com/wallpapers/aug-17/if-a-mozzie-could-tell-you-a-story/cal/aug-17-if-a-mozzie-could-tell-you-a-story-cal-1280×1024.jpg
614. 614 http://files.smashingmagazine.com/wallpapers/aug-17/if-a-mozzie-could-tell-you-a-story/cal/aug-17-if-a-mozzie-could-tell-you-a-story-cal-1366×768.jpg
615. 615 http://files.smashingmagazine.com/wallpapers/aug-17/if-a-mozzie-could-tell-you-a-story/cal/aug-17-if-a-mozzie-could-tell-you-a-story-cal-1440×1050.jpg
616. 616 http://files.smashingmagazine.com/wallpapers/aug-17/if-a-mozzie-could-tell-you-a-story/cal/aug-17-if-a-mozzie-could-tell-you-a-story-cal-1600×1200.jpg
617. 617 http://files.smashingmagazine.com/wallpapers/aug-17/if-a-mozzie-could-tell-you-a-story/cal/aug-17-if-a-mozzie-could-tell-you-a-story-cal-1680×1050.jpg
618. 618 http://files.smashingmagazine.com/wallpapers/aug-17/if-a-mozzie-could-tell-you-a-story/cal/aug-17-if-a-mozzie-could-tell-you-a-story-cal-1680×1200.jpg
619. 619 http://files.smashingmagazine.com/wallpapers/aug-17/if-a-mozzie-could-tell-you-a-story/cal/aug-17-if-a-mozzie-could-tell-you-a-story-cal-1920×1080.jpg
620. 620 http://files.smashingmagazine.com/wallpapers/aug-17/if-a-mozzie-could-tell-you-a-story/cal/aug-17-if-a-mozzie-could-tell-you-a-story-cal-1920×1200.jpg
621. 621 http://files.smashingmagazine.com/wallpapers/aug-17/if-a-mozzie-could-tell-you-a-story/cal/aug-17-if-a-mozzie-could-tell-you-a-story-cal-1920×1440.jpg
622. 622 http://files.smashingmagazine.com/wallpapers/aug-17/if-a-mozzie-could-tell-you-a-story/cal/aug-17-if-a-mozzie-could-tell-you-a-story-cal-2560×1440.jpg
623. 623 http://files.smashingmagazine.com/wallpapers/aug-17/if-a-mozzie-could-tell-you-a-story/nocal/aug-17-if-a-mozzie-could-tell-you-a-story-nocal-320×480.jpg
624. 624 http://files.smashingmagazine.com/wallpapers/aug-17/if-a-mozzie-could-tell-you-a-story/nocal/aug-17-if-a-mozzie-could-tell-you-a-story-nocal-640×480.jpg
625. 625 http://files.smashingmagazine.com/wallpapers/aug-17/if-a-mozzie-could-tell-you-a-story/nocal/aug-17-if-a-mozzie-could-tell-you-a-story-nocal-800×600.jpg
626. 626 http://files.smashingmagazine.com/wallpapers/aug-17/if-a-mozzie-could-tell-you-a-story/nocal/aug-17-if-a-mozzie-could-tell-you-a-story-nocal-1024×768.jpg
627. 627 http://files.smashingmagazine.com/wallpapers/aug-17/if-a-mozzie-could-tell-you-a-story/nocal/aug-17-if-a-mozzie-could-tell-you-a-story-nocal-1024×1024.jpg
628. 628 http://files.smashingmagazine.com/wallpapers/aug-17/if-a-mozzie-could-tell-you-a-story/nocal/aug-17-if-a-mozzie-could-tell-you-a-story-nocal-1152×864.jpg
629. 629 http://files.smashingmagazine.com/wallpapers/aug-17/if-a-mozzie-could-tell-you-a-story/nocal/aug-17-if-a-mozzie-could-tell-you-a-story-nocal-1280×720.jpg
630. 630 http://files.smashingmagazine.com/wallpapers/aug-17/if-a-mozzie-could-tell-you-a-story/nocal/aug-17-if-a-mozzie-could-tell-you-a-story-nocal-1280×800.jpg
631. 631 http://files.smashingmagazine.com/wallpapers/aug-17/if-a-mozzie-could-tell-you-a-story/nocal/aug-17-if-a-mozzie-could-tell-you-a-story-nocal-1280×960.jpg
632. 632 http://files.smashingmagazine.com/wallpapers/aug-17/if-a-mozzie-could-tell-you-a-story/nocal/aug-17-if-a-mozzie-could-tell-you-a-story-nocal-1280×1024.jpg
633. 633 http://files.smashingmagazine.com/wallpapers/aug-17/if-a-mozzie-could-tell-you-a-story/nocal/aug-17-if-a-mozzie-could-tell-you-a-story-nocal-1366×768.jpg
634. 634 http://files.smashingmagazine.com/wallpapers/aug-17/if-a-mozzie-could-tell-you-a-story/nocal/aug-17-if-a-mozzie-could-tell-you-a-story-nocal-1440×1050.jpg
635. 635 http://files.smashingmagazine.com/wallpapers/aug-17/if-a-mozzie-could-tell-you-a-story/nocal/aug-17-if-a-mozzie-could-tell-you-a-story-nocal-1600×1200.jpg
636. 636 http://files.smashingmagazine.com/wallpapers/aug-17/if-a-mozzie-could-tell-you-a-story/nocal/aug-17-if-a-mozzie-could-tell-you-a-story-nocal-1680×1050.jpg
637. 637 http://files.smashingmagazine.com/wallpapers/aug-17/if-a-mozzie-could-tell-you-a-story/nocal/aug-17-if-a-mozzie-could-tell-you-a-story-nocal-1680×1200.jpg
638. 638 http://files.smashingmagazine.com/wallpapers/aug-17/if-a-mozzie-could-tell-you-a-story/nocal/aug-17-if-a-mozzie-could-tell-you-a-story-nocal-1920×1080.jpg
639. 639 http://files.smashingmagazine.com/wallpapers/aug-17/if-a-mozzie-could-tell-you-a-story/nocal/aug-17-if-a-mozzie-could-tell-you-a-story-nocal-1920×1200.jpg
640. 640 http://files.smashingmagazine.com/wallpapers/aug-17/if-a-mozzie-could-tell-you-a-story/nocal/aug-17-if-a-mozzie-could-tell-you-a-story-nocal-1920×1440.jpg
641. 641 http://files.smashingmagazine.com/wallpapers/aug-17/if-a-mozzie-could-tell-you-a-story/nocal/aug-17-if-a-mozzie-could-tell-you-a-story-nocal-2560×1440.jpg
642. 642 http://bit.ly/TheHannonGroup
643. 643 http://files.smashingmagazine.com/wallpapers/aug-17/dc-is-melting-stay-cool/aug-17-dc-is-melting-stay-cool-full.png
644. 644 http://files.smashingmagazine.com/wallpapers/aug-17/dc-is-melting-stay-cool/aug-17-dc-is-melting-stay-cool-preview.png
645. 645 http://files.smashingmagazine.com/wallpapers/aug-17/dc-is-melting-stay-cool/cal/aug-17-dc-is-melting-stay-cool-cal-320×480.png
646. 646 http://files.smashingmagazine.com/wallpapers/aug-17/dc-is-melting-stay-cool/cal/aug-17-dc-is-melting-stay-cool-cal-640×480.png
647. 647 http://files.smashingmagazine.com/wallpapers/aug-17/dc-is-melting-stay-cool/cal/aug-17-dc-is-melting-stay-cool-cal-800×600.png
648. 648 http://files.smashingmagazine.com/wallpapers/aug-17/dc-is-melting-stay-cool/cal/aug-17-dc-is-melting-stay-cool-cal-1024×768.png
649. 649 http://files.smashingmagazine.com/wallpapers/aug-17/dc-is-melting-stay-cool/cal/aug-17-dc-is-melting-stay-cool-cal-1280×960.png
650. 650 http://files.smashingmagazine.com/wallpapers/aug-17/dc-is-melting-stay-cool/cal/aug-17-dc-is-melting-stay-cool-cal-1440×900.png
651. 651 http://files.smashingmagazine.com/wallpapers/aug-17/dc-is-melting-stay-cool/cal/aug-17-dc-is-melting-stay-cool-cal-1600×1200.png
652. 652 http://files.smashingmagazine.com/wallpapers/aug-17/dc-is-melting-stay-cool/cal/aug-17-dc-is-melting-stay-cool-cal-1680×1050.png
653. 653 http://files.smashingmagazine.com/wallpapers/aug-17/dc-is-melting-stay-cool/cal/aug-17-dc-is-melting-stay-cool-cal-1680×1200.png
654. 654 http://files.smashingmagazine.com/wallpapers/aug-17/dc-is-melting-stay-cool/cal/aug-17-dc-is-melting-stay-cool-cal-1920×1080.png
655. 655 http://files.smashingmagazine.com/wallpapers/aug-17/dc-is-melting-stay-cool/cal/aug-17-dc-is-melting-stay-cool-cal-1920×1400.png
656. 656 http://files.smashingmagazine.com/wallpapers/aug-17/dc-is-melting-stay-cool/cal/aug-17-dc-is-melting-stay-cool-cal-2560×1440.png
657. 657 http://files.smashingmagazine.com/wallpapers/aug-17/dc-is-melting-stay-cool/nocal/aug-17-dc-is-melting-stay-cool-nocal-320×480.png
658. 658 http://files.smashingmagazine.com/wallpapers/aug-17/dc-is-melting-stay-cool/nocal/aug-17-dc-is-melting-stay-cool-nocal-640×480.png
659. 659 http://files.smashingmagazine.com/wallpapers/aug-17/dc-is-melting-stay-cool/nocal/aug-17-dc-is-melting-stay-cool-nocal-800×600.png
660. 660 http://files.smashingmagazine.com/wallpapers/aug-17/dc-is-melting-stay-cool/nocal/aug-17-dc-is-melting-stay-cool-nocal-1024×768.png
661. 661 http://files.smashingmagazine.com/wallpapers/aug-17/dc-is-melting-stay-cool/nocal/aug-17-dc-is-melting-stay-cool-nocal-1280×960.png
662. 662 http://files.smashingmagazine.com/wallpapers/aug-17/dc-is-melting-stay-cool/nocal/aug-17-dc-is-melting-stay-cool-nocal-1440×900.png
663. 663 http://files.smashingmagazine.com/wallpapers/aug-17/dc-is-melting-stay-cool/nocal/aug-17-dc-is-melting-stay-cool-nocal-1600×1200.png
664. 664 http://files.smashingmagazine.com/wallpapers/aug-17/dc-is-melting-stay-cool/nocal/aug-17-dc-is-melting-stay-cool-nocal-1680×1050.png
665. 665 http://files.smashingmagazine.com/wallpapers/aug-17/dc-is-melting-stay-cool/nocal/aug-17-dc-is-melting-stay-cool-nocal-1680×1200.png
666. 666 http://files.smashingmagazine.com/wallpapers/aug-17/dc-is-melting-stay-cool/nocal/aug-17-dc-is-melting-stay-cool-nocal-1920×1080.png
667. 667 http://files.smashingmagazine.com/wallpapers/aug-17/dc-is-melting-stay-cool/nocal/aug-17-dc-is-melting-stay-cool-nocal-1920×1400.png
668. 668 http://files.smashingmagazine.com/wallpapers/aug-17/dc-is-melting-stay-cool/nocal/aug-17-dc-is-melting-stay-cool-nocal-2560×1440.png
669. 669 http://alraislabs.com
670. 670 http://files.smashingmagazine.com/wallpapers/aug-17/the-month-of-respect/aug-17-the-month-of-respect-full.jpg
671. 671 http://files.smashingmagazine.com/wallpapers/aug-17/the-month-of-respect/aug-17-the-month-of-respect-preview.jpg
672. 672 http://files.smashingmagazine.com/wallpapers/aug-17/the-month-of-respect/cal/aug-17-the-month-of-respect-cal-320×480.jpg
673. 673 http://files.smashingmagazine.com/wallpapers/aug-17/the-month-of-respect/cal/aug-17-the-month-of-respect-cal-640×480.jpg
674. 674 http://files.smashingmagazine.com/wallpapers/aug-17/the-month-of-respect/cal/aug-17-the-month-of-respect-cal-800×480.jpg
675. 675 http://files.smashingmagazine.com/wallpapers/aug-17/the-month-of-respect/cal/aug-17-the-month-of-respect-cal-800×600.jpg
676. 676 http://files.smashingmagazine.com/wallpapers/aug-17/the-month-of-respect/cal/aug-17-the-month-of-respect-cal-1024×768.jpg
677. 677 http://files.smashingmagazine.com/wallpapers/aug-17/the-month-of-respect/cal/aug-17-the-month-of-respect-cal-1024×1024.jpg
678. 678 http://files.smashingmagazine.com/wallpapers/aug-17/the-month-of-respect/cal/aug-17-the-month-of-respect-cal-1152×864.jpg
679. 679 http://files.smashingmagazine.com/wallpapers/aug-17/the-month-of-respect/cal/aug-17-the-month-of-respect-cal-1280×720.jpg
680. 680 http://files.smashingmagazine.com/wallpapers/aug-17/the-month-of-respect/cal/aug-17-the-month-of-respect-cal-1280×800.jpg
681. 681 http://files.smashingmagazine.com/wallpapers/aug-17/the-month-of-respect/cal/aug-17-the-month-of-respect-cal-1280×960.jpg
682. 682 http://files.smashingmagazine.com/wallpapers/aug-17/the-month-of-respect/cal/aug-17-the-month-of-respect-cal-1280×1024.jpg
683. 683 http://files.smashingmagazine.com/wallpapers/aug-17/the-month-of-respect/cal/aug-17-the-month-of-respect-cal-1366×768.jpg
684. 684 http://files.smashingmagazine.com/wallpapers/aug-17/the-month-of-respect/cal/aug-17-the-month-of-respect-cal-1440×900.jpg
685. 685 http://files.smashingmagazine.com/wallpapers/aug-17/the-month-of-respect/cal/aug-17-the-month-of-respect-cal-1440×1050.jpg
686. 686 http://files.smashingmagazine.com/wallpapers/aug-17/the-month-of-respect/cal/aug-17-the-month-of-respect-cal-1600×1200.jpg
687. 687 http://files.smashingmagazine.com/wallpapers/aug-17/the-month-of-respect/cal/aug-17-the-month-of-respect-cal-1680×1050.jpg
688. 688 http://files.smashingmagazine.com/wallpapers/aug-17/the-month-of-respect/cal/aug-17-the-month-of-respect-cal-1680×1200.jpg
689. 689 http://files.smashingmagazine.com/wallpapers/aug-17/the-month-of-respect/cal/aug-17-the-month-of-respect-cal-1920×1080.jpg
690. 690 http://files.smashingmagazine.com/wallpapers/aug-17/the-month-of-respect/cal/aug-17-the-month-of-respect-cal-1920×1200.jpg
691. 691 http://files.smashingmagazine.com/wallpapers/aug-17/the-month-of-respect/cal/aug-17-the-month-of-respect-cal-1920×1440.jpg
692. 692 http://files.smashingmagazine.com/wallpapers/aug-17/the-month-of-respect/cal/aug-17-the-month-of-respect-cal-2560×1440.jpg
693. 693 http://files.smashingmagazine.com/wallpapers/aug-17/the-month-of-respect/nocal/aug-17-the-month-of-respect-nocal-320×480.jpg
694. 694 http://files.smashingmagazine.com/wallpapers/aug-17/the-month-of-respect/nocal/aug-17-the-month-of-respect-nocal-640×480.jpg
695. 695 http://files.smashingmagazine.com/wallpapers/aug-17/the-month-of-respect/nocal/aug-17-the-month-of-respect-nocal-800×480.jpg
696. 696 http://files.smashingmagazine.com/wallpapers/aug-17/the-month-of-respect/nocal/aug-17-the-month-of-respect-nocal-800×600.jpg
697. 697 http://files.smashingmagazine.com/wallpapers/aug-17/the-month-of-respect/nocal/aug-17-the-month-of-respect-nocal-1024×768.jpg
698. 698 http://files.smashingmagazine.com/wallpapers/aug-17/the-month-of-respect/nocal/aug-17-the-month-of-respect-nocal-1024×1024.jpg
699. 699 http://files.smashingmagazine.com/wallpapers/aug-17/the-month-of-respect/nocal/aug-17-the-month-of-respect-nocal-1152×864.jpg
700. 700 http://files.smashingmagazine.com/wallpapers/aug-17/the-month-of-respect/nocal/aug-17-the-month-of-respect-nocal-1280×720.jpg
701. 701 http://files.smashingmagazine.com/wallpapers/aug-17/the-month-of-respect/nocal/aug-17-the-month-of-respect-nocal-1280×800.jpg
702. 702 http://files.smashingmagazine.com/wallpapers/aug-17/the-month-of-respect/nocal/aug-17-the-month-of-respect-nocal-1280×960.jpg
703. 703 http://files.smashingmagazine.com/wallpapers/aug-17/the-month-of-respect/nocal/aug-17-the-month-of-respect-nocal-1280×1024.jpg
704. 704 http://files.smashingmagazine.com/wallpapers/aug-17/the-month-of-respect/nocal/aug-17-the-month-of-respect-nocal-1366×768.jpg
705. 705 http://files.smashingmagazine.com/wallpapers/aug-17/the-month-of-respect/nocal/aug-17-the-month-of-respect-nocal-1440×900.jpg
706. 706 http://files.smashingmagazine.com/wallpapers/aug-17/the-month-of-respect/nocal/aug-17-the-month-of-respect-nocal-1440×1050.jpg
707. 707 http://files.smashingmagazine.com/wallpapers/aug-17/the-month-of-respect/nocal/aug-17-the-month-of-respect-nocal-1600×1200.jpg
708. 708 http://files.smashingmagazine.com/wallpapers/aug-17/the-month-of-respect/nocal/aug-17-the-month-of-respect-nocal-1680×1050.jpg
709. 709 http://files.smashingmagazine.com/wallpapers/aug-17/the-month-of-respect/nocal/aug-17-the-month-of-respect-nocal-1680×1200.jpg
710. 710 http://files.smashingmagazine.com/wallpapers/aug-17/the-month-of-respect/nocal/aug-17-the-month-of-respect-nocal-1920×1080.jpg
711. 711 http://files.smashingmagazine.com/wallpapers/aug-17/the-month-of-respect/nocal/aug-17-the-month-of-respect-nocal-1920×1200.jpg
712. 712 http://files.smashingmagazine.com/wallpapers/aug-17/the-month-of-respect/nocal/aug-17-the-month-of-respect-nocal-1920×1440.jpg
713. 713 http://files.smashingmagazine.com/wallpapers/aug-17/the-month-of-respect/nocal/aug-17-the-month-of-respect-nocal-2560×1440.jpg
714. 714 http://metrovista.com
715. 715 http://files.smashingmagazine.com/wallpapers/aug-17/let-success-make-the-noise/aug-17-let-success-make-the-noise-full.png
716. 716 http://files.smashingmagazine.com/wallpapers/aug-17/let-success-make-the-noise/aug-17-let-success-make-the-noise-preview.png
717. 717 http://files.smashingmagazine.com/wallpapers/aug-17/let-success-make-the-noise/cal/aug-17-let-success-make-the-noise-cal-640×480.png
718. 718 http://files.smashingmagazine.com/wallpapers/aug-17/let-success-make-the-noise/cal/aug-17-let-success-make-the-noise-cal-800×600.png
719. 719 http://files.smashingmagazine.com/wallpapers/aug-17/let-success-make-the-noise/cal/aug-17-let-success-make-the-noise-cal-1024×768.png
720. 720 http://files.smashingmagazine.com/wallpapers/aug-17/let-success-make-the-noise/cal/aug-17-let-success-make-the-noise-cal-1152×864.png
721. 721 http://files.smashingmagazine.com/wallpapers/aug-17/let-success-make-the-noise/cal/aug-17-let-success-make-the-noise-cal-1280×720.png
722. 722 http://files.smashingmagazine.com/wallpapers/aug-17/let-success-make-the-noise/cal/aug-17-let-success-make-the-noise-cal-1280×960.png
723. 723 http://files.smashingmagazine.com/wallpapers/aug-17/let-success-make-the-noise/cal/aug-17-let-success-make-the-noise-cal-1366×768.png
724. 724 http://files.smashingmagazine.com/wallpapers/aug-17/let-success-make-the-noise/cal/aug-17-let-success-make-the-noise-cal-1400×1050.png
725. 725 http://files.smashingmagazine.com/wallpapers/aug-17/let-success-make-the-noise/cal/aug-17-let-success-make-the-noise-cal-1600×1200.png
726. 726 http://files.smashingmagazine.com/wallpapers/aug-17/let-success-make-the-noise/cal/aug-17-let-success-make-the-noise-cal-1920×1080.png
727. 727 http://files.smashingmagazine.com/wallpapers/aug-17/let-success-make-the-noise/cal/aug-17-let-success-make-the-noise-cal-1920×1440.png
728. 728 http://files.smashingmagazine.com/wallpapers/aug-17/let-success-make-the-noise/cal/aug-17-let-success-make-the-noise-cal-2560×1440.png
729. 729 http://files.smashingmagazine.com/wallpapers/aug-17/let-success-make-the-noise/nocal/aug-17-let-success-make-the-noise-nocal-640×480.png
730. 730 http://files.smashingmagazine.com/wallpapers/aug-17/let-success-make-the-noise/nocal/aug-17-let-success-make-the-noise-nocal-800×600.png
731. 731 http://files.smashingmagazine.com/wallpapers/aug-17/let-success-make-the-noise/nocal/aug-17-let-success-make-the-noise-nocal-1024×768.png
732. 732 http://files.smashingmagazine.com/wallpapers/aug-17/let-success-make-the-noise/nocal/aug-17-let-success-make-the-noise-nocal-1152×864.png
733. 733 http://files.smashingmagazine.com/wallpapers/aug-17/let-success-make-the-noise/nocal/aug-17-let-success-make-the-noise-nocal-1280×720.png
734. 734 http://files.smashingmagazine.com/wallpapers/aug-17/let-success-make-the-noise/nocal/aug-17-let-success-make-the-noise-nocal-1280×960.png
735. 735 http://files.smashingmagazine.com/wallpapers/aug-17/let-success-make-the-noise/nocal/aug-17-let-success-make-the-noise-nocal-1366×768.png
736. 736 http://files.smashingmagazine.com/wallpapers/aug-17/let-success-make-the-noise/nocal/aug-17-let-success-make-the-noise-nocal-1400×1050.png
737. 737 http://files.smashingmagazine.com/wallpapers/aug-17/let-success-make-the-noise/nocal/aug-17-let-success-make-the-noise-nocal-1600×1200.png
738. 738 http://files.smashingmagazine.com/wallpapers/aug-17/let-success-make-the-noise/nocal/aug-17-let-success-make-the-noise-nocal-1920×1080.png
739. 739 http://files.smashingmagazine.com/wallpapers/aug-17/let-success-make-the-noise/nocal/aug-17-let-success-make-the-noise-nocal-1920×1440.png
740. 740 http://files.smashingmagazine.com/wallpapers/aug-17/let-success-make-the-noise/nocal/aug-17-let-success-make-the-noise-nocal-2560×1440.png
741. 741 http://www.mariakellerac.com
742. 742 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/aug-17-play-together-full.png
743. 743 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/aug-17-play-together-preview.png
744. 744 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/cal/aug-17-play-together-cal-320×480.png
745. 745 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/cal/aug-17-play-together-cal-640×480.png
746. 746 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/cal/aug-17-play-together-cal-640×1136.png
747. 747 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/cal/aug-17-play-together-cal-750×1334.png
748. 748 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/cal/aug-17-play-together-cal-800×480.png
749. 749 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/cal/aug-17-play-together-cal-800×600.png
750. 750 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/cal/aug-17-play-together-cal-1024×768.png
751. 751 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/cal/aug-17-play-together-cal-1024×1024.png
752. 752 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/cal/aug-17-play-together-cal-1152×864.png
753. 753 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/cal/aug-17-play-together-cal-1242×2208.png
754. 754 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/cal/aug-17-play-together-cal-1280×720.png
755. 755 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/cal/aug-17-play-together-cal-1280×800.png
756. 756 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/cal/aug-17-play-together-cal-1280×960.png
757. 757 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/cal/aug-17-play-together-cal-1280×1024.png
758. 758 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/cal/aug-17-play-together-cal-1366×768.png
759. 759 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/cal/aug-17-play-together-cal-1400×1050.png
760. 760 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/cal/aug-17-play-together-cal-1440×900.png
761. 761 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/cal/aug-17-play-together-cal-1600×1200.png
762. 762 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/cal/aug-17-play-together-cal-1680×1050.png
763. 763 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/cal/aug-17-play-together-cal-1680×1200.png
764. 764 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/cal/aug-17-play-together-cal-1920×1080.png
765. 765 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/cal/aug-17-play-together-cal-1920×1200.png
766. 766 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/cal/aug-17-play-together-cal-1920×1440.png
767. 767 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/cal/aug-17-play-together-cal-2560×1440.png
768. 768 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/cal/aug-17-play-together-cal-2880×1800.png
769. 769 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/nocal/aug-17-play-together-nocal-320×480.png
770. 770 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/nocal/aug-17-play-together-nocal-640×480.png
771. 771 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/nocal/aug-17-play-together-nocal-640×1136.png
772. 772 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/nocal/aug-17-play-together-nocal-750×1334.png
773. 773 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/nocal/aug-17-play-together-nocal-800×480.png
774. 774 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/nocal/aug-17-play-together-nocal-800×600.png
775. 775 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/nocal/aug-17-play-together-nocal-1024×768.png
776. 776 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/nocal/aug-17-play-together-nocal-1024×1024.png
777. 777 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/nocal/aug-17-play-together-nocal-1152×864.png
778. 778 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/nocal/aug-17-play-together-nocal-1242×2208.png
779. 779 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/nocal/aug-17-play-together-nocal-1280×720.png
780. 780 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/nocal/aug-17-play-together-nocal-1280×800.png
781. 781 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/nocal/aug-17-play-together-nocal-1280×960.png
782. 782 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/nocal/aug-17-play-together-nocal-1280×1024.png
783. 783 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/nocal/aug-17-play-together-nocal-1366×768.png
784. 784 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/nocal/aug-17-play-together-nocal-1400×1050.png
785. 785 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/nocal/aug-17-play-together-nocal-1440×900.png
786. 786 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/nocal/aug-17-play-together-nocal-1600×1200.png
787. 787 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/nocal/aug-17-play-together-nocal-1680×1050.png
788. 788 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/nocal/aug-17-play-together-nocal-1680×1200.png
789. 789 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/nocal/aug-17-play-together-nocal-1920×1080.png
790. 790 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/nocal/aug-17-play-together-nocal-1920×1200.png
791. 791 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/nocal/aug-17-play-together-nocal-1920×1440.png
792. 792 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/nocal/aug-17-play-together-nocal-2560×1440.png
793. 793 http://files.smashingmagazine.com/wallpapers/aug-17/play-together/nocal/aug-17-play-together-nocal-2880×1800.png
794. 794 https://github.com/BootstrapDash/StarAdmin-Free-Bootstrap-Admin-Template
795. 795 http://files.smashingmagazine.com/wallpapers/aug-17/colorful-summer/aug-17-colorful-summer-full.png
796. 796 http://files.smashingmagazine.com/wallpapers/aug-17/colorful-summer/aug-17-colorful-summer-preview.png
797. 797 http://files.smashingmagazine.com/wallpapers/aug-17/colorful-summer/cal/aug-17-colorful-summer-cal-360×640.png
798. 798 http://files.smashingmagazine.com/wallpapers/aug-17/colorful-summer/cal/aug-17-colorful-summer-cal-1024×768.png
799. 799 http://files.smashingmagazine.com/wallpapers/aug-17/colorful-summer/cal/aug-17-colorful-summer-cal-1280×720.png
800. 800 http://files.smashingmagazine.com/wallpapers/aug-17/colorful-summer/cal/aug-17-colorful-summer-cal-1280×800.png
801. 801 http://files.smashingmagazine.com/wallpapers/aug-17/colorful-summer/cal/aug-17-colorful-summer-cal-1280×960.png
802. 802 http://files.smashingmagazine.com/wallpapers/aug-17/colorful-summer/cal/aug-17-colorful-summer-cal-1280×1024.png
803. 803 http://files.smashingmagazine.com/wallpapers/aug-17/colorful-summer/cal/aug-17-colorful-summer-cal-1366×768.png
804. 804 http://files.smashingmagazine.com/wallpapers/aug-17/colorful-summer/cal/aug-17-colorful-summer-cal-1400×1050.png
805. 805 http://files.smashingmagazine.com/wallpapers/aug-17/colorful-summer/cal/aug-17-colorful-summer-cal-1440×900.png
806. 806 http://files.smashingmagazine.com/wallpapers/aug-17/colorful-summer/cal/aug-17-colorful-summer-cal-1600×900.png
807. 807 http://files.smashingmagazine.com/wallpapers/aug-17/colorful-summer/cal/aug-17-colorful-summer-cal-1680×1200.png
808. 808 http://files.smashingmagazine.com/wallpapers/aug-17/colorful-summer/cal/aug-17-colorful-summer-cal-1920×1080.png
809. 809 http://files.smashingmagazine.com/wallpapers/aug-17/colorful-summer/nocal/aug-17-colorful-summer-nocal-360×640.png
810. 810 http://files.smashingmagazine.com/wallpapers/aug-17/colorful-summer/nocal/aug-17-colorful-summer-nocal-1024×768.png
811. 811 http://files.smashingmagazine.com/wallpapers/aug-17/colorful-summer/nocal/aug-17-colorful-summer-nocal-1280×720.png
812. 812 http://files.smashingmagazine.com/wallpapers/aug-17/colorful-summer/nocal/aug-17-colorful-summer-nocal-1280×800.png
813. 813 http://files.smashingmagazine.com/wallpapers/aug-17/colorful-summer/nocal/aug-17-colorful-summer-nocal-1280×960.png
814. 814 http://files.smashingmagazine.com/wallpapers/aug-17/colorful-summer/nocal/aug-17-colorful-summer-nocal-1280×1024.png
815. 815 http://files.smashingmagazine.com/wallpapers/aug-17/colorful-summer/nocal/aug-17-colorful-summer-nocal-1366×768.png
816. 816 http://files.smashingmagazine.com/wallpapers/aug-17/colorful-summer/nocal/aug-17-colorful-summer-nocal-1400×1050.png
817. 817 http://files.smashingmagazine.com/wallpapers/aug-17/colorful-summer/nocal/aug-17-colorful-summer-nocal-1440×900.png
818. 818 http://files.smashingmagazine.com/wallpapers/aug-17/colorful-summer/nocal/aug-17-colorful-summer-nocal-1600×900.png
819. 819 http://files.smashingmagazine.com/wallpapers/aug-17/colorful-summer/nocal/aug-17-colorful-summer-nocal-1680×1200.png
820. 820 http://files.smashingmagazine.com/wallpapers/aug-17/colorful-summer/nocal/aug-17-colorful-summer-nocal-1920×1080.png
821. 821 https://www.safiabegum.com/
822. 822 http://files.smashingmagazine.com/wallpapers/aug-17/happy-birthday-edith/aug-17-happy-birthday-edith-full.png
823. 823 http://files.smashingmagazine.com/wallpapers/aug-17/happy-birthday-edith/aug-17-happy-birthday-edith-preview.png
824. 824 http://files.smashingmagazine.com/wallpapers/aug-17/happy-birthday-edith/cal/aug-17-happy-birthday-edith-cal-800×450.png
825. 825 http://files.smashingmagazine.com/wallpapers/aug-17/happy-birthday-edith/cal/aug-17-happy-birthday-edith-cal-1280×720.png
826. 826 http://files.smashingmagazine.com/wallpapers/aug-17/happy-birthday-edith/cal/aug-17-happy-birthday-edith-cal-1366×768.png
827. 827 http://files.smashingmagazine.com/wallpapers/aug-17/happy-birthday-edith/cal/aug-17-happy-birthday-edith-cal-1440×810.png
828. 828 http://files.smashingmagazine.com/wallpapers/aug-17/happy-birthday-edith/cal/aug-17-happy-birthday-edith-cal-1600×900.png
829. 829 http://files.smashingmagazine.com/wallpapers/aug-17/happy-birthday-edith/cal/aug-17-happy-birthday-edith-cal-1680×945.png
830. 830 http://files.smashingmagazine.com/wallpapers/aug-17/happy-birthday-edith/cal/aug-17-happy-birthday-edith-cal-1920×1080.png
831. 831 http://files.smashingmagazine.com/wallpapers/aug-17/happy-birthday-edith/cal/aug-17-happy-birthday-edith-cal-2560×1440.png
832. 832 http://files.smashingmagazine.com/wallpapers/aug-17/happy-birthday-edith/nocal/aug-17-happy-birthday-edith-nocal-800×450.png
833. 833 http://files.smashingmagazine.com/wallpapers/aug-17/happy-birthday-edith/nocal/aug-17-happy-birthday-edith-nocal-1280×720.png
834. 834 http://files.smashingmagazine.com/wallpapers/aug-17/happy-birthday-edith/nocal/aug-17-happy-birthday-edith-nocal-1366×768.png
835. 835 http://files.smashingmagazine.com/wallpapers/aug-17/happy-birthday-edith/nocal/aug-17-happy-birthday-edith-nocal-1440×810.png
836. 836 http://files.smashingmagazine.com/wallpapers/aug-17/happy-birthday-edith/nocal/aug-17-happy-birthday-edith-nocal-1600×900.png
837. 837 http://files.smashingmagazine.com/wallpapers/aug-17/happy-birthday-edith/nocal/aug-17-happy-birthday-edith-nocal-1680×945.png
838. 838 http://files.smashingmagazine.com/wallpapers/aug-17/happy-birthday-edith/nocal/aug-17-happy-birthday-edith-nocal-1920×1080.png
839. 839 http://files.smashingmagazine.com/wallpapers/aug-17/happy-birthday-edith/nocal/aug-17-happy-birthday-edith-nocal-2560×1440.png
840. 840 https://www.behance.net/CaiteyBlaze
841. 841 http://files.smashingmagazine.com/wallpapers/aug-17/back-to-work/aug-17-back-to-work-full.png
842. 842 http://files.smashingmagazine.com/wallpapers/aug-17/back-to-work/aug-17-back-to-work-preview.png
843. 843 http://files.smashingmagazine.com/wallpapers/aug-17/back-to-work/cal/aug-17-back-to-work-cal-320×480.png
844. 844 http://files.smashingmagazine.com/wallpapers/aug-17/back-to-work/cal/aug-17-back-to-work-cal-800×600.png
845. 845 http://files.smashingmagazine.com/wallpapers/aug-17/back-to-work/cal/aug-17-back-to-work-cal-1024×768.png
846. 846 http://files.smashingmagazine.com/wallpapers/aug-17/back-to-work/cal/aug-17-back-to-work-cal-1280×720.png
847. 847 http://files.smashingmagazine.com/wallpapers/aug-17/back-to-work/cal/aug-17-back-to-work-cal-1280×1024.png
848. 848 http://files.smashingmagazine.com/wallpapers/aug-17/back-to-work/cal/aug-17-back-to-work-cal-1400×1050.png
849. 849 http://files.smashingmagazine.com/wallpapers/aug-17/back-to-work/cal/aug-17-back-to-work-cal-1680×1050.png
850. 850 http://files.smashingmagazine.com/wallpapers/aug-17/back-to-work/cal/aug-17-back-to-work-cal-1920×1080.png
851. 851 http://files.smashingmagazine.com/wallpapers/aug-17/back-to-work/cal/aug-17-back-to-work-cal-1920×1440.png
852. 852 http://files.smashingmagazine.com/wallpapers/aug-17/back-to-work/cal/aug-17-back-to-work-cal-2560×1440.png
853. 853 http://files.smashingmagazine.com/wallpapers/aug-17/back-to-work/nocal/aug-17-back-to-work-nocal-320×480.png
854. 854 http://files.smashingmagazine.com/wallpapers/aug-17/back-to-work/nocal/aug-17-back-to-work-nocal-800×600.png
855. 855 http://files.smashingmagazine.com/wallpapers/aug-17/back-to-work/nocal/aug-17-back-to-work-nocal-1024×768.png
856. 856 http://files.smashingmagazine.com/wallpapers/aug-17/back-to-work/nocal/aug-17-back-to-work-nocal-1280×720.png
857. 857 http://files.smashingmagazine.com/wallpapers/aug-17/back-to-work/nocal/aug-17-back-to-work-nocal-1280×1024.png
858. 858 http://files.smashingmagazine.com/wallpapers/aug-17/back-to-work/nocal/aug-17-back-to-work-nocal-1400×1050.png
859. 859 http://files.smashingmagazine.com/wallpapers/aug-17/back-to-work/nocal/aug-17-back-to-work-nocal-1680×1050.png
860. 860 http://files.smashingmagazine.com/wallpapers/aug-17/back-to-work/nocal/aug-17-back-to-work-nocal-1920×1080.png
861. 861 http://files.smashingmagazine.com/wallpapers/aug-17/back-to-work/nocal/aug-17-back-to-work-nocal-1920×1440.png
862. 862 http://files.smashingmagazine.com/wallpapers/aug-17/back-to-work/nocal/aug-17-back-to-work-nocal-2560×1440.png
863. 863 https://www.smashingmagazine.com/desktop-wallpaper-calendars-join-in/

↑ Back to topTweet itShare on Facebook

Do you ever wish you had a time machine? I certainly do, but not for the usual reasons. I want a time machine so I can go back and have a frank conversation with my younger self. I’ll let you in on a bit of a secret: My younger self was an idiot!

I have been working on the web for over 22 years now, and I feel like I wasted so many of those years. If only I could go back and share a few hard truths with myself at the start of my career. Unfortunately, I cannot, but I can share that advice with you.

Admittedly, you are almost certainly not as idiotic as I was. But hopefully, there will be something in this advice that inspires you.

Speaking of inspiration, that leads me nicely into my first piece of wisdom!

Look Beyond The Web For Inspiration Link

I used to be a dedicated follower of fashion who wasted so much time looking at other “cool” websites and browsing galleries of inspirational websites. My design style would morph to embrace the latest trends, from Web 2.0 to hero banners.

The result of this was bland “me too” design. But worst of all, it never put the user first. It was all about making something look good in my portfolio.

It was such a waste because so much inspiration is all around us: great books on classic print design, architectural trends, even airport signage (a personal obsession of mine).

Don’t make my mistakes. You don’t even have the luxury of my excuses. With CSS grid³, the possibilities are endless, and we should all embrace them.

On the subject of latest trends, that brings me to my next transgression: obsessing over tools.

Stop Obsessing Over Tools Link

We’ve wasted hours arguing over what tool is best. Should we code in PHP or classic ASP? (Yes, I am that old.) Can I be a “proper” web designer and code in Dreamweaver? Which content management systems should we use? The list went on.

Some tool or other would become trendy for whatever reason, and we would all jump on the bandwagon, until the next one emerged, and we jumped to that after an even more furious debate.

I see the same today: arguments over frameworks⁴ and whether we should embrace Angular or React. I don’t follow these discussions anymore because somewhere along the line I realized something: There is no single answer.

⁵

A lot of these choices come down to personal preference or the requirements of the individual client. Remain flexible and open to change. If you don’t, you’ll go the way of Flash developers.

All of that time I wasted arguing about tools would have been so much better spent elsewhere, like on improving my soft skills.

Get Better At Working With Others Link

I was an insufferable know-it-all when I was young. I always had the answers and always knew a better way to do something. I am sure you are not like that, although, let’s be honest, how would you know if you were? I certainly had no idea how irritating I was, despite the warning signs.

For a start, I found myself constantly arguing with everybody. Everything seemed like a battle because nobody around me “got it.” In hindsight, that was because I was too busy irritating everybody to take the time to explain things properly. But at the time, it just felt like everybody else was stupid.

I wish I had realized how weak I was in this area. Perhaps then I would have invested time and energy in improving how I worked alongside other people. Maybe I would have listened more and put the same effort into understanding my colleagues as I did my users.

I am not suggesting I should have done this necessarily to be a good man (trust me, I am not now). Instead, I should have done this because it would have made my life so much easier. I wasted endless time arguing and alienating people, people I needed on my side to do my job. It was incredibly frustrating.

⁷

If I had developed that skill of working with people earlier, it would have also allowed me to push beyond the confines of my role.

Always Push Beyond Your Job Description Link

I confess that, for many years, I was a bit of a job’s worth. I was a designer, and I spent much of my working life complaining because other people weren’t doing their jobs properly. Clients failed to deliver copy, developers didn’t implement my designs correctly, and project managers were always putting unrealistic constraints on me.

To be fair to my younger self, these were all real problems. But I did nothing but moan about them. I made no effort to help my colleagues fix these issues. I never questioned why the client was failing to deliver content or why the project manager seemed so unreasonable? I didn’t bother to understand the constraints they faced.

When I did eventually wake up and start paying attention, I discovered a bigger world. I found out just how interconnected digital and the user experience are, and how many things beyond the screen influence the experience.

I learned so much over that time, and you can, too. Take the time to understand the roles of those around you. Understand their challenges and constraints. Understand their perspectives and motivations. This will not only improve your working relationship, but make you better at your job, too.

⁹

If you are a designer, this will enhance your designs, making them more useful in the “real world.” If you are a developer, you will understand the challenges users face and the impact you have on the user experience¹¹. And so it goes on.

Ultimately, this will make you better at your job and hopefully progress your career. But a successful career is about more than being good at your job.

Commit To Putting Yourself Out There Link

You could be the best designer or developer in the world, but if nobody has heard of you, you will have little success. That probably isn’t right or fair, but that is the reality.

I’ll be honest with you: Many people are far better at their jobs than me. But I speak all around the world, write books and have built a significant following, not because I am good at what I do, but because I put myself out there.

But it took me so long to realize that. I wasted years moaning about how it was unfair that other people got to write and speak and how my ideas were just as good as theirs.

Eventually, it twigged that I didn’t need anybody’s permission to start sharing my thoughts. I could write on a blog without a publisher and speak on a podcast without a conference.

You can, too. Not only that, you should! If you are not sharing what you have learned, you are invisible, and that will hamper your career.

¹²

You might feel you have nothing new to say. Don’t worry, just share what you have learned. There will always be people who haven’t learned those lessons yet.

You might feel nobody is listening. Again, don’t worry. If you persevere, eventually people will start paying attention. I’ll let you in on a secret: Quality is not the number one reason for success. Consistency is. Even second-rate content will draw attention if you release it regularly enough.

Put yourself out there, in whatever way you choose. It will enable you to build contacts in the industry. That will help you avoid the last mistake my younger self-made: wasting too many years working for appalling bosses.

Don’t Put Up With A Terrible Boss Link

I worked for some truly nasty people, ranging from the incompetent to the criminal. Two ended up in prison, and the only good guy I ever worked for died of a heart attack due to stress!

I wasted years working for these people, years of them undervaluing my work and failing to invest in enabling me to do it better. Admittedly, I could be a bit of an idiot, as we have already established. But even with hindsight, these people were terrible. Unfortunately, apathy and fear prevented me from moving on.

Don’t make my mistake. There is no need. We are much in demand. Getting good digital staff is incredibly challenging, and you owe no loyalty to a boss who doesn’t value your expertise.

Instead, find a company that is going to nurture you and help you grow in your career. I’ll be honest: I never achieved that. I never had a mentor or somebody to teach me. I stumbled my way through my career, and I think I am the poorer for it. So, don’t settle. You deserve better, and loads of great jobs are out there.

(al)

Footnotes Link

1. 1 https://www.smashingmagazine.com/wp-content/uploads/2017/06/01-The-Missing-Advice-I-Needed-When-Starting-My-Career-large-opt.jpg
2. 2 https://www.smashingmagazine.com/wp-content/uploads/2017/06/01-The-Missing-Advice-I-Needed-When-Starting-My-Career-large-opt.jpg
3. 3 https://www.smashingmagazine.com/2016/11/css-grids-flexbox-and-box-alignment-our-new-system-for-web-layout/
4. 4 https://www.smashingmagazine.com/2017/03/which-responsive-design-framework-is-best/
5. 5 https://www.smashingmagazine.com/wp-content/uploads/2017/06/02-The-Missing-Advice-I-Needed-When-Starting-My-Career-large-opt.jpg
6. 6 https://www.smashingmagazine.com/wp-content/uploads/2017/06/02-The-Missing-Advice-I-Needed-When-Starting-My-Career-large-opt.jpg
7. 7 https://www.smashingmagazine.com/wp-content/uploads/2017/06/03-The-Missing-Advice-I-Needed-When-Starting-My-Career-large-opt.jpg
8. 8 https://www.smashingmagazine.com/wp-content/uploads/2017/06/03-The-Missing-Advice-I-Needed-When-Starting-My-Career-large-opt.jpg
9. 9 https://www.smashingmagazine.com/wp-content/uploads/2017/06/Empathy-map-large-opt.jpg
10. 10 https://www.smashingmagazine.com/wp-content/uploads/2017/06/Empathy-map-large-opt.jpg
11. 11 https://boagworld.com/dev/why-you-should-want-to-be-a-user-experience-developer/
12. 12 https://www.smashingmagazine.com/wp-content/uploads/2017/06/04-The-Missing-Advice-I-Needed-When-Starting-My-Career-large-opt.jpg
13. 13 https://www.smashingmagazine.com/wp-content/uploads/2017/06/04-The-Missing-Advice-I-Needed-When-Starting-My-Career-large-opt.jpg

↑ Back to topTweet itShare on Facebook

In these politically uncertain times, developers can help to defend their users’ personal privacy by adopting the Privacy by Design (PbD) framework. These common-sense steps will become a requirement under the EU’s imminent data protection overhaul, but the benefits of the framework go far beyond legal compliance.

Note: This article is not legal advice and should not be construed as such.

Meet Privacy By Design Link

Let’s give credit where credit is due. The global political upheaval of the past 12 months has done more to get developers thinking about privacy, surveillance and defensive user protection than ever before. The risks and threats to ourselves, and to our users, are no longer theoretical; they are real, they are everyday, and they are frightening. One need only look at the ongoing revelations regarding Cambridge Analytica, a British company with odd links to Canada, which ran a complex data-mining operation on behalf of Donald Trump’s presidential campaign to aggregate up to 5,000 pieces of data on every American adult¹, to fathom what is at stake for all of us.

See Also:

• Privacy Guidelines For Designing Personalization²
• Driving App Engagement³ With Personalization Techniques
• Real-Time Data And A More Personalized Web⁴

As developers and decision-makers, we need to do something to respond to that challenge. The political uncertainty we are living through obliges us to change the ways we approach our work. As the creators of applications and the data flows they create, we can play a critical and positive role in protecting our users from attacks on their privacy, their dignity, and even their safety.

One way we can do this is by adopting a privacy-first best-practice framework. This framework, known as Privacy by Design (PbD), is about anticipating, managing and preventing privacy issues before a single line of code is written. The best way to mitigate privacy risks, according to the PbD philosophy, is not to create them in the first place.

PbD has existed as a best-practice framework since the 1990s, but few developers are aware of it, let alone use it. That’s about to change. The EU’s data protection overhaul, GDPR, which becomes legally enforceable in May 2018, requires privacy by design as well as data protection by default across all uses and applications.

As with the previous EU data protection regime, any developer serving European customers must adhere to these data protection standards even if they themselves are not located in Europe. So, if you do business in or sell to Europe, privacy by design is now your responsibility.

This presents a monumental opportunity for developers everywhere to rethink their approach to privacy. Let’s learn what PbD is and how it works.

What Is PbD? Link

The PbD framework was first drawn up in Canada⁵ in the 1990s. Its originator, Dr. Ann Cavoukian, then Privacy Commissioner of Ontario, devised the framework to address the common issue of developers applying privacy fixes after a project is completed:

The Privacy by Design framework prevents privacy-invasive events before they happen. Privacy by Design does not wait for privacy risks to materialize, nor does it offer remedies for resolving privacy infractions once they have occurred; it aims to prevent them from occurring. In short, Privacy by Design comes before-the-fact, not after.

The PbD framework has seven foundational principles:

1. Privacy must be proactive, not reactive, and must anticipate privacy issues before they reach the user. Privacy must also be preventative, not remedial.
2. Privacy must be the default setting. The user should not have to take actions to secure their privacy, and consent for data sharing should not be assumed.
3. Privacy must be embedded into design. It must be a core function of the product or service, not an add-on.
4. Privacy must be positive sum and should avoid dichotomies. For example, PbD sees an achievable balance between privacy and security, not a zero-sum game of privacy or security.
5. Privacy must offer end-to-end lifecycle protection of user data. This means engaging in proper data minimization, retention and deletion processes.
6. Privacy standards must be visible, transparent, open, documented and independently verifiable. Your processes, in other words, must stand up to external scrutiny.
7. Privacy must be user-centric. This means giving users granular privacy options, maximized privacy defaults, detailed privacy information notices, user-friendly options and clear notification of changes.

Why PbD Matters More Than Ever Link

PbD has always been available for any developer to use as a voluntary best-practice framework. Its popularity has tended to be greater in cultures that have a traditionally positive view of privacy, such as Canada and many European countries. Privacy, however, is not traditionally seen as a positive value in the US, whose companies dominate the tech world. For this reason, and for too long, web development has been approached with what at times has felt like the complete opposite of a PbD viewpoint. It has almost become normal for developers to ship apps that require social media registration, that request unnecessary permissions such as microphone access and location data, and that demand access to all of a user’s contacts.

The notion of privacy by design as a voluntary concept is about to change.

In Europe, the regulation that governs all collection and processing of personal data, regardless of use, sector or situation, has had a complete overhaul. This new set of rules, known as the General Data Protection Regulation⁶ (GDPR), is already on the books but becomes legally enforceable on 25 May 2018. Your business should already be working towards your wider GDPR compliance obligations ahead of this deadline, which will come up fast.

Crucially, GDPR makes PbD and privacy by default legal requirements within the EU. Not only will you have to develop to PbD, but you will have to document your PbD development processes. That documentation must be made available to a European regulatory authority in the event of a data breach or a consumer complaint.

“What If I Am Not in the EU?” Link

Remember that European data protection and privacy laws are extraterritorial: They apply to the people within Europe whom data is collected about, regardless of where the service is provided from. In other words, if you develop for European customers, you must comply with EU data protection and privacy standards for those individuals, even if you yourself are not located within Europe.

Also remember that the EU, through its data protection system, has some of the strictest and most clearly defined privacy frameworks in the world; the US, by contrast, has no overarching data protection and privacy framework at all. Culture is important to remember as well. In Europe, privacy is considered a fundamental human right. Living and developing in a country where privacy is not a fundamental human right does not negate your moral or legal obligations to those who do enjoy that right.

Developers outside the EU, therefore, should consider adopting the PbD principles within the GDPR guidelines as a development framework, despite being located outside Europe. The guidelines will give you a clear, common-sense and accountable framework to use in your development process — and that framework is a lot better than having no guidelines at all.

What Is Personal Data? Link

The European data protection law defines personal data as any information about a living individual who could be identified from that data, either on its own or when combined with other information.

There is also a classification called “sensitive personal data”, which means any information concerning an individual’s

• Racial or ethnic origin
• political opinions,
• religious or philosophical beliefs,
• trade union membership,
• health data,
• genetic data,
• biometric data,
• sex life or sexual orientation,
• past or spent criminal convictions.

The data users generate within your app is personal data. Their account information with your company is personal data. The UID identifying their device is personal data. So is their IP address, their location data, their browser fingerprint and any identifiable telemetry.

Practical PbD Implementation Link

For app developers, PbD compliance means factoring in data privacy by default

• at your app’s initial design stage,
• throughout its lifecycle,
• throughout the user’s engagement with your app,
• after the user’s engagement has ended,
• and after the app is mothballed.

There is no checklist of ready-made questions that will get you there; General Data Protection Regulation requires developers to come up with the questions as well as the answers. But in a proactive development environment, the answers would likely take the practical forms required under GDPR, such as the following.

Design Stage Link

• Create a privacy-impact assessment template for your business to use for all functions involving personal data, which we will come to a bit later on.
• Review contracts with partners and third parties to ensure the data you pass on to them is being processed in accordance with PbD and GDPR.
• Don’t require unnecessary app permissions, especially those that imply privacy invasion, such as access to contacts or to the microphone.
• Audit the security of your systems, which we will also come to shortly.

Lifecycle Link

• Minimize the amount of collected data.
• Minimize the amount of data shared with third parties.
• Where possible, pseudonymize personal data.
• Revisit contact forms, sign-up pages and customer-service entry points.
• Enable the regular deletion of data created through these processes.

User Engagement Link

• Provide clear privacy- and data-sharing notices.
• Embed granular opt-ins throughout those notices.
• Don’t require social media registration to access the app.
• Don’t enable social media sharing by default.
• Separate consent for essential third-party data sharing from consent for analytics and advertising.

End of Engagement and Mothballing Link

• Periodically remind users to review and refresh their privacy settings.
• Allow users to download and delete old data.
• Delete the data of users who have closed their accounts.
• Delete all user data when the app’s life comes to an end.

PbD In Action Link

Good PbD practice, and its absence, is easy to spot if you know what you are looking for.

Let’s give this popular UK pub chain’s app a quick PbD audit.

The app has no settings page, which suggests no user control over privacy. This implies that downloading the app entails granting consent for data-sharing, which does not meet the second PbD principle.

⁸

This suggestion is confirmed in the “Edit Account” option, which only allows users to edit their name and email address. This does not meet the third PbD principle “Privacy must be embedded into design.”

⁹

The link to the privacy policy provides a blurry scan of a five-page PDF that is written for the outdated 1995 data protection directive. There are no user controls or granular options. If I wanted to exercise control over my data, I would have to write an email to a generic customer-service address or, alternatively — in the time-honored tradition of privacy policies that are really trying to fob users off — send them a letter in the post. This does not meet the seventh PbD principle of giving users granular privacy options with maximized privacy defaults.

¹⁰

The privacy policy informs me that my data will be shared with third parties but gives me no indication as to who those third parties are, nor does it give me the option to withhold that data sharing. There is no distinction between third parties whose services are necessary for the transaction (for example, PayPal) and unnecessary services, such as ad networks. This does not meet the sixth PbD principle.

But let’s say I write about this stuff for a living, and so I just really need a beer. I go to the pub and fire up the Wi-Fi to use its app. When I connect to the Wi-Fi, I notice its “Settings” page. That page merely provides links to three legal documents. As with the pub’s own app, there are no settings to change, no options and no choices. There is no PbD whatsoever.

¹¹

It’s clear that the only way I can ensure my privacy with this pub chain is to not use the app or its Wi-Fi at all. This creates the zero-sum dichotomy, which the fourth PbD principle seeks to avoid.

This pub chain does not meet good PbD practice, or GDPR compliance, by any definition.

By contrast, Twitter’s recent privacy overhaul demonstrates very good PbD practice and early GDPR compliance. Here’s the catch: Its new privacy choices could have a detrimental and negative effect on users’ privacy¹². The difference, however, is that it has been open and transparent and has given users educated choices and options.

¹³

The privacy overhaul offers a range of granular privacy options, which are clearly communicated, including a clear notice that it may share your data with third parties. Users can disable some or all options.

¹⁴

A prominent splash screen drew users’ attention to the changes, increasing the likelihood that they would take the time to educate themselves on their privacy options.

¹⁵

Privacy Impact Assessment Link

A privacy impact assessment (PIA) is simply a process of documenting the issues, questions and actions required to implement a healthy PbD process in a project, service or product. PIAs are a core requirement of GDPR, and in the event of a data protection issue, your PIA will determine the shape of your engagement with a regulatory authority. You should use a PIA when starting a new project, and run a PIA evaluation of any existing ones.

The steps in a PIA are as follows:

1. Identify the need for a PIA.
2. Describe the information flows within a project or service (user to service provider, user to user, service provider to user, user to third parties, service provider to third parties).
3. Identify the privacy- and data-protection risks.
4. Identify and evaluate the privacy solutions.
5. Sign off and record the PIA outcomes.
6. Integrate the outcomes into the project plan.
7. Consult with internal and external stakeholders as needed throughout the process.

Take some time to come up with a PIA template unique to your business or project that you can use as needed. The guidance from ICO¹⁶, the UK data-protection regulator, will help you to do that.

Privacy Information Notice Link

Good PbD practice gives users clear information and informed choices. Privacy information notices are central to that. The days of privacy policies being pages upon pages of dense legal babble, focused on the needs of the service provider and not the user, are over.

Your app, product or service should have a privacy information notice, including the following details:

• What data are you collecting?
• Why are you collecting it, and is that reasoning legally justifiable?
• Which third parties are you sharing it with?
• What third-party data are you aggregating it with?
• Where are you getting that information from?
• How long are you keeping it?
• How can the user invoke their rights?
• Include any information regarding the use of personal data to fulfil a contract.

Many European data protection regulators are devising standardized templates for privacy information notices, and you should check with yours to follow the progress on any required format ahead of the May 2018 deadline.

Under GDPR, the old privacy policy trick of stating “we may share your data with third parties” will no longer be considered compliant. GDPR and PbD require you to list exactly who those parties are and what they do with user data.

¹⁷

As one dramatic example, PayPal’s recent updated notice lists over 600 third-party service providers¹⁸. The fact that PayPal shares data with up to 600 third parties is not news. That information is simply being brought into the open.

Security Measures Link

Good PbD compliance is not just about UX. Healthy compliance also involves implementing adequate technical and security measures to protect user data. These measures, as with other aspects of full GDPR compliance, must be documented and made accountable to a regulator on request.

PbD compliance on a technical and security level could include:

• password hashing and salting;
• data sandboxing;
• pseudonymization and anonymization;
• automated background updates;
• encryption at rest and in transit;
• responsible disclosure;
• staff training and accountability on data protection;
• physical security of servers, systems and storage.

Data Protection Officer Link

Under GDPR, companies processing certain kinds of data must appoint a Data Protection Officer (DPO), a named individual with legally accountable responsibility for an organization’s privacy compliance, including PbD. This requirement is regardless of a company’s size, which means that even the tiniest business engaged in certain kinds of data processing must appoint a DPO.

¹⁹

A DPO does not have to be in-house or full-time, nor are legal qualifications required. Very small businesses can appoint a DPO on an ad-hoc or outsourced basis. Check with your EU member state’s data-protection regulator for information on your national requirements for a DPO.

We would encourage all organizations to voluntarily appoint a DPO regardless of the nature of their work. Think of a DPO as the health and safety officer for privacy. Having someone act as the “good cop” to keep your development processes legally compliant — and acting as the “bad cop” if your practices are slipping — can save you from a world of troubles down the road.

Change Your Thinking Link

The PbD framework poses challenges that only you can answer. No one else can do it for you: it is your responsibility to commence the process. If you are within Europe, have a look at your national data-protection regulator’s GDPR and PbD resources. If you are outside Europe, we have provided some links and resources below.

Don’t view PbD as a checklist of boxes to be ticked because “the law says so,” nor think of it as something you have to do “or else.” Instead, use PbD to think really creatively. Think of all the ways that your users’ data can be misused, accessed, stolen, shared or combined. Think of where data might be located, even if you might not be aware of it. Think of what liabilities you might be creating for yourself by collecting, retaining and aggregating data that you don’t really need. Think of how the third parties you share data with, even if they are your business partners, could create liabilities for you. And in our current political climate, think about the ways that the data you collect and process could be used to do harm to your users. There are no wrong questions to ask, but there are questions that it would be wrong not to ask.

Adopting PbD into your development workflow will create new steps to follow and new obligations to meet. These steps, as onerous as they might feel, are necessary in our rapidly changing world. So, view PbD as a culture shift. Use it as an opportunity to improve your policies, practices and products by incorporating privacy into your development culture. Your users will be better protected, your business’s reputation will improve, and you will be well on the road to healthy legal compliance. In an often bewildering world, if these steps are all we can take to make a difference one app at a time, they are worth a lot.

More Information and Resources Link

• “Privacy by Design²⁰,” Information and Privacy Commissioner of Ontario
  
  An introduction.
• “Privacy by Design²¹,” The UK ICO’s guidance on PbD, specific to the UK but in plain English.
• Conducting Privacy Impact Assessments: Code of Practice²²” (PDF), Information Commissioner’s Office
• Privacy in Mobile Apps: Guidance for App Developers²³” (PDF), Information Commissioner’s Office
• “Data Protection: Better Rules for Small Business²⁴,” European Commission
  
  Overview of the EU’s GDPR.
• “Privacy Design Guidelines for Mobile Application Development²⁵,” GSMA

(al)

Footnotes Link

1. 1 http://wapo.st/2eQnPI0
2. 2 https://www.smashingmagazine.com/2016/03/privacy-for-personalization/
3. 3 https://www.smashingmagazine.com/2016/09/driving-app-engagement-with-personalization-techniques/
4. 4 https://www.smashingmagazine.com/2011/04/real-time-data-and-a-more-personalized-web/
5. 5 https://www.ipc.on.ca/privacy/protecting-personal-information/privacy-by-design/
6. 6 http://ec.europa.eu/justice/newsroom/data-protection/infographic/2017/index_en.htm
7. 7 https://www.smashingmagazine.com/wp-content/uploads/2017/07/privacy-by-design-800.png
8. 8 https://www.smashingmagazine.com/wp-content/uploads/2017/06/app-example-1-large-opt.png
9. 9 https://www.smashingmagazine.com/wp-content/uploads/2017/06/app-example-2-large-opt.png
10. 10 https://www.smashingmagazine.com/wp-content/uploads/2017/06/app-example-3-large-opt.png
11. 11 https://www.smashingmagazine.com/wp-content/uploads/2017/06/sky-wifi-large-opt.jpg
12. 12 https://www.cnet.com/how-to/change-your-twitter-privacy-settings-now/
13. 13 https://www.smashingmagazine.com/wp-content/uploads/2017/06/twitter-2-large-opt.png
14. 14 https://www.smashingmagazine.com/wp-content/uploads/2017/06/twitter-3-large-opt.png
15. 15 https://www.smashingmagazine.com/wp-content/uploads/2017/06/twitter-1-opt.jpg
16. 16 https://ico.org.uk/media/for-organisations/documents/1595/pia-code-of-practice.pdf
17. 17 https://www.smashingmagazine.com/wp-content/uploads/2017/06/paypal-third-parties-large-opt.jpg
18. 18 https://www.paypal.com/uk/webapps/mpp/ua/third-parties-list
19. 19 https://www.smashingmagazine.com/wp-content/uploads/2017/07/do-you-need-a-data-protection-officer-800.png
20. 20 https://www.ipc.on.ca/privacy/protecting-personal-information/privacy-by-design/
21. 21 https://ico.org.uk/for-organisations/guide-to-data-protection/privacy-by-design/
22. 22 https://ico.org.uk/media/for-organisations/documents/1595/pia-code-of-practice.pdf
23. 23 https://ico.org.uk/media/for-organisations/documents/1596/privacy-in-mobile-apps-dp-guidance.pdf
24. 24 http://ec.europa.eu/justice/newsroom/data-protection/infographic/2017/index_en.htm
25. 25 https://www.gsma.com/publicpolicy/privacy-design-guidelines-mobile-application-development?cn=bWVzc2FnZQ%3D%3D

↑ Back to topTweet itShare on Facebook

Some people hate writing documentation, and others just hate writing. I happen to love writing; otherwise, you wouldn’t be reading this. It helps that I love writing because, as a design consultant offering professional guidance, writing is a big part of what I do. But I hate, hate, hate word processors.

My typical workflow using a desktop word processor goes something like this:

1. Select some text I want to copy to another part of the document.
2. Note that the application has selected slightly more or less than I told it to.
3. Try again.
4. Give up and resolve to add the missing part (or remove the extra part) of my intended selection later.
5. Copy and paste the selection.
6. Note that the formatting of the pasted text is somehow different from the original.
7. Try to find the styling preset that matches the original text.
8. Try to apply the preset.
9. Give up and apply the font family and size manually.
10. Note that there is too much white space above the pasted text, and press “Backspace” to close the gap.
11. Note that the text in question has elevated itself several lines at once, joined the heading text above it and adopted its styling.
12. Ponder my mortality.

When writing technical web documentation (read: pattern libraries¹), word processors are not just disobedient, but inappropriate. Ideally, I want a mode of writing that allows me to include the components I’m documenting inline, and this isn’t possible unless the documentation itself is made of HTML, CSS, and JavaScript. In this article, I’ll be sharing a method for easily including code demos in Markdown, with the help of shortcodes and shadow DOM encapsulation.

CSS And Markdown Link

Say what you will about CSS, but it’s certainly a more consistent and reliable typesetting tool than any WYSIWYG editor or word processor on the market. Why? Because there’s no high-level black-box algorithm that tries to second-guess what styles you really intended to go where. Instead, it’s very explicit: You define which elements take which styles in which circumstances², and it honors those rules.

The only trouble with CSS is that it requires you to write its counterpart, HTML. Even great lovers of HTML would likely concede that writing it manually is on the arduous side when you just want to produce prose content. This is where Markdown comes in. With its terse syntax and reduced feature set, it offers a mode of writing that is easy to learn but can still — once converted into HTML programmatically — harness CSS’ powerful and predictable typesetting features. There’s a reason why it has become the de facto format for static website generators and modern blogging platforms such as Ghost.

Where more complex, bespoke markup is required, most Markdown parsers will accept raw HTML in the input. However, the more one relies on complex markup, the less accessible one’s authoring system is to those who are less technical, or those short on time and patience. This is where shortcodes come in.

Shortcodes In Hugo Link

Hugo³ is a static site generator written in Go — a multi-purpose, compiled language developed at Google. Due to concurrency (and, no doubt, other low-level language features I don’t fully understand), Go makes Hugo a lightening-fast generator of static web content. This is one of the many reasons why Hugo has been chosen for the new version of Smashing Magazine.

Performance aside, it works in a similar fashion to the Ruby and Node.js⁴-based generators with which you may already be familiar: Markdown plus meta data (YAML or TOML) processed via templates. Sara Soueidan has written an excellent primer⁵ on Hugo’s core functionality.

For me, Hugo’s killer feature is its implementation of shortcodes⁶. Those coming from WordPress may already be familiar with the concept: a shortened syntax primarily used for including the complex embed codes of third-party services. For instance, WordPress includes a Vimeo shortcode that takes just the ID of the Vimeo video in question.

The brackets signify that their content should be processed as a shortcode and expanded into the full HTML embed markup when the content is parsed.

Making use of Go template functions, Hugo provides an extremely simple API for creating custom shortcodes. For example, I have created a simple Codepen shortcode to include among my Markdown content:

Some Markdown content before the shortcode. Aliquam sodales rhoncus dui, sed congue velit semper ut. Class aptent taciti sociosqu ad litora torquent. {{<codePen VpVNKW>}} Some Markdown content after the shortcode. Nulla vel magna sit amet dui lobortis commodo vitae vel nulla sit amet ante hendrerit tempus. 

Hugo automatically looks for a template named codePen.html in the shortcodes subfolder to parse the shortcode during compilation. My implementation looks like this:

{{ if .Site.Params.codePenUser }} <iframe height='300' scrolling='no' title="code demonstration with codePen" src='//codepen.io/{{ .Site.Params.codepenUser | lower }}/embed/{{ .Get 0 }}/?height=265&theme-id=dark&default-tab=result,result&embed-version=2' frameborder='no' allowtransparency='true' allowfullscreen='true' style='width: 100%;'> <div> <a href="http://www.smashingmagazine.com//codepen.io/{{ .Site.Params.codePenUser | lower }}/pen/{{ .Get 0 }}">See the demo on codePen</a> </div> </iframe> {{ else }} <p><strong>Site error:</strong> The <code>codePenUser</code> param has not been set in <code>config.toml</code></p> {{ end }} 

To get a better idea of how the Go template package works, you’ll want to consult Hugo’s “Go Template Primer⁷.” In the meantime, just note the following:

• It’s pretty fugly but powerful nonetheless.
• The {{ .Get 0 }} part is for retrieving the first (and, in this case, only) argument supplied — the Codepen ID. Hugo also supports named arguments, which are supplied like HTML attributes.
• The . syntax refers to the current context. So, .Get 0 means “Get the first argument supplied for the current shortcode.”

In any case, I think shortcodes are the best thing since shortbread, and Hugo’s implementation for writing custom shortcodes is impressive. I should note from my research that it’s possible to use Jekyll includes⁸ to similar effect, but I find them less flexible and powerful.

Code Demos Without Third Parties Link

I have a lot of time for Codepen (and the other code playgrounds that are available), but there are inherent issues with including such content in a pattern library:

• It uses an API so cannot be easily or efficiently made to work offline.
• It doesn’t just represent the pattern or component; it is its own complex interface wrapped in its own branding. This creates unnecessary noise and distraction when the focus should be on the component.

For some time, I tried to embed component demos using my own iframes. I would point the iframe to a local file containing the demo as its own web page. By using iframes, I was able to encapsulate style and behavior without relying on a third party.

Unfortunately, iframes are rather unwieldy and difficult to resize dynamically. In terms of authoring complexity, it also entails maintaining separate files and having to link to them. I’d prefer to write my components in place, including just the code needed to make them work. I want to be able to write demos as I write their documentation.

The demo Shortcode Link

Fortunately, Hugo allows you to create shortcodes that include content between opening and closing shortcode tags. The content is available in the shortcode file using {{ .Inner }}. So, suppose I were to use a demo shortcode like this:

{{<demo>}} This is the content! {{</demo>}} 

“This is the content!” would be available as {{ .Inner }} in the demo.html template that parses it. This is a good starting point for supporting inline code demos, but I need to address encapsulation.

Style Encapsulation Link

When it comes to encapsulating styles, there are three things to worry about:

• styles being inherited by the component from the parent page,
• the parent page inheriting styles from the component,
• styles being shared unintentionally between components.

One solution is to carefully manage CSS selectors so that there’s no overlap between components and between components and the page. This would mean using esoteric selectors per component, and it is not something I would be interested in having to consider when I could be writing terse, readable code. One of the advantages of iframes is that styles are encapsulated by default, so I could write button { background: blue } and be confident it would only apply inside the iframe.

A less intensive way to prevent components from inheriting styles from the page is to use the all property with the initial value on an elected parent element. I can set this element in the demo.html file:

<div> {{ .Inner }} </div> 

Then, I need to apply all: initial to instances of this element, which propagates to children of each instance.

.demo { all: initial } 

The behavior of initial is quite… idiosyncratic. In practice, all of the affected elements go back to adopting just their user agent styles (like display: block for <h2> elements). However, the element to which it is applied — class="demo" — needs to have certain user agent styles explicitly reinstated. In our case, this is just display: block, since class="demo" is a <div>.

.demo { all: initial; display: block; } 

Note:all is so far not supported in Microsoft Edge but is under consideration. Support is, otherwise, reassuringly broad⁹. For our purposes, the revert value would be more robust and reliable but it is not yet supported anywhere.

Shadow DOM’ing The Shortcode Link

Using all: initial does not make our inline components completely immune to outside influence (specificity still applies), but we can be confident that styles are unset because we are dealing with the reserved demo class name. Mostly just inherited styles from low-specificity selectors such as html and body will be eliminated.

Nonetheless, this only deals with styles coming from the parent into components. To prevent styles written for components from affecting other parts of the page, we’ll need to use shadow DOM¹⁰ to create an encapsulated subtree.

Imagine I want to document a styled <button> element. I’d like to be able to simply write something like the following, without fear that the button element selector will apply to <button> elements in the pattern library itself or in other components in the same library page.

{{<demo>}} <button>My button</button> <style> button { background: blue; padding: 0.5rem 1rem; text-transform: uppercase; } </style> {{</demo>}} 

The trick is to take the {{ .Inner }} part of the shortcode template and include it as the innerHTML of a new ShadowRoot. I might implement this like so:

{{ $uniq := .Inner | htmlEscape | base64Encode | truncate 15 "" }} <div></div> <script> (function() { var root = document.getElementById('demo-{{ $uniq }}'); root.attachShadow({mode: 'open'}); root.innerHTML = '{{ .Inner }}'; })(); </script> 

• $uniq is set as a variable to identify the component container. It pipes in some Go template functions to create a unique string… hopefully(!) — this isn’t a bulletproof method; it’s just for illustration.
• root.attachShadow makes the component container a shadow DOM host.
• I populate the innerHTML of the ShadowRoot using {{ .Inner }}, which includes the now-encapsulated CSS.

Permitting JavaScript Behavior Link

I’d also like to include JavaScript behavior in my components. At first, I thought this would be easy; unfortunately, JavaScript inserted via innerHTML is not parsed or executed. This can be solved by importing from the content of a <template> element. I amended my implementation accordingly.

{{ $uniq := .Inner | htmlEscape | base64Encode | truncate 15 "" }} <div></div> <template> {{ .Inner }} </template> <script> (function() { var root = document.getElementById('demo-{{ $uniq }}'); root.attachShadow({mode: 'open'}); var template = document.getElementById('template-{{ $uniq }}'); root.shadowRoot.appendChild(document.importNode(template.content, true)); })(); </script> 

Now, I’m able to include an inline demo of, say, a working toggle button:

{{<demo>}} <button>My button</button> <style> button { background: blue; padding: 0.5rem 1rem; text-transform: uppercase; } [aria-pressed="true"] { box-shadow: inset 0 0 5px #000; } </style> <script> var toggle = document.querySelector('[aria-pressed]'); toggle.addEventListener('click', (e) => { let pressed = e.target.getAttribute('aria-pressed') === 'true'; e.target.setAttribute('aria-pressed', !pressed); }); </script> {{</demo>}} 

Note: I have written in depth about toggle buttons and accessibility¹¹ for Inclusive Components.

JavaScript Encapsulation Link

JavaScript is, to my surprise, not encapsulated automatically¹² like CSS is in shadow DOM. That is, if there was another [aria-pressed] button in the parent page before this component’s example, then document.querySelector would target that instead.

What I need is an equivalent to document for just the demo’s subtree. This is definable, albeit quite verbosely:

document.getElementById('demo-{{ $uniq }}').shadowRoot; 

I didn’t want to have to write this expression whenever I had to target elements inside demo containers. So, I came up with a hack whereby I assigned the expression to a local demo variable and prefixed scripts supplied via the shortcode with this assignment:

if (script) { script.textContent = `(function() { var demo = document.getElementById('demo-{{ $uniq }}').shadowRoot; ${script.textContent} })()` } root.shadowRoot.appendChild(document.importNode(template.content, true)); 

With this in place, demo becomes the equivalent of document for any component subtrees, and I can use demo.querySelector to easily target my toggle button.

var toggle = demo.querySelector('[aria-pressed]'); 

Note that I have enclosed the demo’s script contents in an immediately invoked function expression (IIFE), so that the demo variable — and all proceeding variables used for the component — are not in the global scope. This way, demo can be used in any shortcode’s script but will only refer to the shortcode in hand.

Where ECMAScript6 is available, it’s possible to achieve localization using “block scoping,” with just braces enclosing let or const statements. However, all other definitions within the block would have to use let or const (eschewing var) as well.

{ let demo = document.getElementById('demo-{{ $uniq }}').shadowRoot; // Author script injected here } 

Shadow DOM Support Link

Of course, all of the above is only possible where shadow DOM version 1 is supported. Chrome, Safari, Opera and Android all look pretty good, but Firefox and Microsoft browsers are problematic. It is possible to feature-detect support and provide an error message where attachShadow is not available:

if (document.head.attachShadow) { // Do shadow DOM stuff here } else { root.innerHTML = 'Shadow DOM is needed to display encapsulated demos. The browser does not have an issue with the demo code itself'; } 

Or you can include Shady DOM and the Shady CSS extension, which means a somewhat large dependency (60 KB+) and a different API. Rob Dodson was kind enough to provide me with a basic demo¹³, which I’m happy to share to help you get started.

Captions For Components Link

With the basic inline demo functionality in place, quickly writing working demos inline with their documentation is mercifully straightforward. This affords us the luxury of being able to ask questions like, “What if I want to provide a caption to label the demo?” This is perfectly possible already since — as previously noted — Markdown supports raw HTML.

<figure role="group" aria-labelledby="caption-button"> {{<demo>}} <button>My button</button> <style> button { background: blue; padding: 0.5rem 1rem; text-transform: uppercase; } </style> {{</demo>}} <figcaption>A standard button</figcaption> </figure> 

However, the only new part of this amended structure is the wording of the caption itself. Better to provide a simple interface for supplying it to the output, saving my future self — and anyone else using the shortcode — time and effort and reducing the risk of coding typos. This is possible by supplying a named parameter to the shortcode — in this case, simply named caption:

{{<demo caption="A standard button"}} ... demo contents here... {{</demo>}} 

Named parameters are accessible in the template like {{ .Get "caption" }}, which is simple enough. I want the caption and, therefore, the surrounding <figure> and <figcaption> to be optional. Using if clauses, I can supply the relevant content only where the shortcode provides a caption argument:

{{ if .Get "caption" }} <figcaption>{{ .Get "caption" }}</figcaption> {{ end }} 

Here’s how the full demo.html template now looks (admittedly, it’s a bit of a mess, but it does the trick):

{{ $uniq := .Inner | htmlEscape | base64Encode | truncate 15 "" }} {{ if .Get "caption" }} <figure role="group" aria-labelledby="caption-{{ $uniq }}"> {{ end }} <div></div> {{ if .Get "caption" }} <figcaption>{{ .Get "caption" }}</figcaption> {{ end }} {{ if .Get "caption" }} </figure> {{ end }} <template> {{ .Inner }} </template> <script> (function() { var root = document.getElementById('demo-{{ $uniq }}'); root.attachShadow({mode: 'open'}); var template = document.getElementById('template-{{ $uniq }}'); var script = template.content.querySelector('script'); if (script) { script.textContent = `(function() { var demo = document.getElementById('demo-{{ $uniq }}').shadowRoot; ${script.textContent} })()` } root.shadowRoot.appendChild(document.importNode(template.content, true)); })(); </script>

One last note: Should I want to support markdown syntax in the caption value, I can pipe it through Hugo’s markdownify function. This way, the author is able to supply markdown (and HTML) but is not forced to do either.

{{ .Get "caption" | markdownify }} 

Conclusion Link

For its performance and its many excellent features, Hugo is currently a comfortable fit for me when it comes to static site generation. But the inclusion of shortcodes is what I find most compelling. In this case, I was able to create a simple interface for a documentation issue that I’ve been trying to solve for some time.

As in web components, a lot of markup complexity (sometimes exacerbated by adjusting for accessibility) can be hidden behind shortcodes. In this case, I’m referring to my inclusion of role="group" and the aria-labelledby relationship, which provides a better supported “group label” to the <figure> — not things that anyone relishes coding more than once, especially where unique attribute values need to be considered in each instance.

I believe shortcodes are to Markdown and content what web components are to HTML and functionality: a way to make authorship easier, more reliable and more consistent. I look forward to further evolution in this curious little field of the web.

Resources Link

• Hugo documentation¹⁴
• “Package Template¹⁵,” The Go Programming Language
• “Shortcodes¹⁶,” Hugo
• “all¹⁷” (CSS shorthand property), Mozilla Developer Network
• “initial¹⁸ (CSS keyword), Mozilla Developer Network
• “Shadow DOM v1: Self-Contained Web Components¹⁹,” Eric Bidelman, Web Fundamentals, Google Developers
• “Introduction to Template Elements²⁰,” Eiji Kitamura, WebComponents.org
• “Includes²¹,” Jekyll

(vf, al, il)

Footnotes Link

1. 1 https://www.smashingmagazine.com/taking-pattern-libraries-next-level/
2. 2 https://www.smashingmagazine.com/2016/11/css-inheritance-cascade-global-scope-new-old-worst-best-friends/
3. 3 https://www.smashingmagazine.com/2015/11/static-website-generators-jekyll-middleman-roots-hugo-review/#hugo
4. 4 https://www.smashingmagazine.com/2017/03/interactive-command-line-application-node-js/
5. 5 https://www.sarasoueidan.com/blog/jekyll-ghpages-to-hugo-netlify/
6. 6 https://gohugo.io/extras/shortcodes/
7. 7 https://gohugo.io/templates/go-templates/
8. 8 https://jekyllrb.com/docs/includes/
9. 9 https://caniuse.com/#feat=css-all
10. 10 https://glazkov.com/2011/01/14/what-the-heck-is-shadow-dom/
11. 11 https://inclusive-components.design/toggle-button/
12. 12 http://robdodson.me/shadow-dom-javascript/
13. 13 https://gist.github.com/robdodson/287030402bad4b496a0361314138f0f9
14. 14 https://gohugo.io/overview/introduction/
15. 15 https://golang.org/pkg/text/template/
16. 16 https://gohugo.io/extras/shortcodes
17. 17 https://developer.mozilla.org/en/docs/Web/CSS/all
18. 18 https://developer.mozilla.org/en-US/docs/Web/CSS/initial
19. 19 https://developers.google.com/web/fundamentals/getting-started/primers/shadowdom
20. 20 https://www.webcomponents.org/community/articles/introduction-to-template-element
21. 21 https://jekyllrb.com/docs/includes/

↑ Back to topTweet itShare on Facebook

For many people, a map of a transportation network is a given, an expected part of the system, something that just is — like a fire-escape plan in a building. So, when I say that I design transportation maps, they don’t understand. What is there to design even?

Well, let’s take the London underground map as an example. Designed by Harry Beck, it was the world’s first transportation map to use the principles of electrical circuit drawings. All line segments were put to the angles of 45 or 90 degrees. The distances between stations were equalized. I wrote about it in part three of my “Maps and Reality” series, “Diagrams¹.”

This schematic approach was later adopted for many transportation maps of the world. But not every time was this a good idea. This is one useless map (from Samara, Russia):

³

It adds almost nothing beyond just listing the stations: Алабинская · Российская · Московская · Гагаринская · Спортивная · Советская…

Beck’s design dealt with growing complexity and the spread of London’s underground rail network. When there is just one line, it’s better to put this line in context. See the Ekaterinburg metro map⁵, for example:

⁶

Every transportation network requires a specialized solution.

Further Reading on SmashingMag: Link

• Maps In Modern Web Design: Showcase and Examples⁹
• The Joy Of Illustrated Maps In The Era Of Google Earth¹⁰
• A Common Misconception About Designing With Data¹¹
• Color Contrast And Why You Should Rethink It¹²