Browsing articles in "Web Design"
Sep
16
2014

Essential Visual Feedback Tools For Web Designers


  

The creative process takes a lot of time, and web designers know it. When you factor in feedback from clients, the process takes even longer: numerous emails, revision notes, chats and meetings — that’s what it normally takes to find out precisely what the client wants.

Essential Visual Feedback Tools For Web Designers

Fortunately, today’s web provides various solutions to optimize the communication process. The first web services that allow users to report bugs on web pages appeared several years ago. Since then, tools and technologies have emerged to make the process more convenient and user-friendly. Today’s market offers several useful useful products for visual bug-tracking, each with its pros and cons.

The post Essential Visual Feedback Tools For Web Designers appeared first on Smashing Magazine.

Sep
15
2014

Making Modal Windows Better For Everyone


  

To you, modal windows might be a blessing of additional screen real estate, providing a way to deliver contextual information, notifications and other actions relevant to the current screen. On the other hand, modals might feel like a hack that you’ve been forced to commit in order to cram extra content on the screen. These are the extreme ends of the spectrum, and users are caught in the middle. Depending on how a user browses the Internet, modal windows can be downright confusing.

Making Modal Windows Better For Everyone

Modals quickly shift visual focus from one part of a website or application to another area of (hopefully related) content. The action is usually not jarring if initiated by the user, but it can be annoying and disorienting if it occurs automatically, as happens with the modal window’s evil cousins, the “nag screen” and the “interstitial.”

The post Making Modal Windows Better For Everyone appeared first on Smashing Magazine.

Sep
12
2014

Are Your Internal Systems Damaging Your Business?


  

The internal systems of many organizations have shocking user interfaces. This costs companies in productivity, training and even the customer experience. Fortunately, we can fix this.

Are Your Internal Systems Damaging Your Business?

“How come I can download an app on my phone and instantly know how to use it, yet need training to use our content management system? Shouldn’t our system be intuitive?” This was just one of the comments I heard in a recent stakeholder interview. People are fed up with inadequate internal systems. Many of those I interviewed had given up on the official software. Instead, they use tools like Dropbox, Google Docs and Evernote.

The post Are Your Internal Systems Damaging Your Business? appeared first on Smashing Magazine.

Sep
11
2014

Dropbox’s Carousel Design Deconstructed (Part 2)


  

Many of today’s hottest technology companies, both large and small, are increasingly using the concept of the minimum viable product (MVP) as way to iteratively learn about their customers and develop their product ideas. This two-part series, looks into the product design process of Dropbox’s Carousel.

Dropbox’s Carousel Design Deconstructed (Part 2)

Part 1 covered the core user, their needs and Dropbox’s business needs, and broke down existing photo and video apps. This second part is about Carousel’s primary requirements, the end product, its performance and key learnings since the launch.

The post Dropbox’s Carousel Design Deconstructed (Part 2) appeared first on Smashing Magazine.

Sep
10
2014

Creating Clickthrough Prototypes With Blueprint


  

In a previous article, I discussed using POP to create sketch-based clickthrough prototypes in participatory design exercises. These prototypes capture well the flow and overall layout of early design alternatives.

bp-preview-instructions-preview-opt

The same piece briefly mentioned another category of clickthrough prototypes: widget-based mockups that are designed on the target device and that expand on sketches by introducing user interface (UI) details and increased visual fidelity. These prototypes can be used to pitch ideas to clients, document interactions and even test usability. In this article, I will teach you how to use the iPad app Blueprint to put together such prototypes in the form of concept demos, which help to manage a client’s expectations when you are aligning your visions of a product.

The post Creating Clickthrough Prototypes With Blueprint appeared first on Smashing Magazine.

Sep
8
2014

Improving Smashing Magazine’s Performance: A Case Study


  

Today Smashing Magazine turns eight years old. Eight years is a long time on the web, yet for us it really doesn’t feel like a long journey at all. Things have changed, evolved and moved on, and we gratefully take on new challenges one at a time. To mark this special little day, we’d love to share a few things that we’ve learned over the last year about the performance challenges of this very website and about the work we’ve done recently. If you want to craft a fast responsive website, you might find a few interesting nuggets worth considering. – Ed.

Improving Smashing Magazine's Performance: A Case Study

Improvement is a matter of steady, ongoing iteration. When we redesigned Smashing Magazine back in 2012, our main goal was to establish trustworthy branding that would reflect the ambitious editorial direction of the magazine. We did that primarily by focusing on crafting a delightful reading experience. Over the years, our focus hasn’t changed a bit; however, that very asset that helped to establish our branding turned into a major performance bottleneck.

The post Improving Smashing Magazine’s Performance: A Case Study appeared first on Smashing Magazine.

Sep
5
2014

Internal Developer Training: Doing It Right


  

Successful developers all have something in common: the desire to create. To fully realize that creativity, they need to continually improve their skills. The web industry has grown from this desire to learn. You only need to look at the unwavering demand for conferences, workshops and training days for evidence of this.

Internal Developer Training: Doing It Right

For many companies, however, these sources of training require time and money that simply might not be available — especially when you consider that technologies evolve all the time. The cost of continually sending your team to workshops and training days can quickly become unsustainable.

The post Internal Developer Training: Doing It Right appeared first on Smashing Magazine.

Sep
4
2014

Animating Without jQuery


  

There’s a false belief in the web development community that CSS animation is the only performant way to animate on the web. This myth has coerced many developers to abandon JavaScript-based animation altogether, thereby (1) forcing themselves to manage complex UI interaction within style sheets, (2) locking themselves out of supporting Internet Explorer 8 and 9, and (3) forgoing the beautiful motion design physics that are possible only with JavaScript.

Animating Without jQuery

Reality check: JavaScript-based animation is often as fast as CSS-based animation — sometimes even faster. CSS animation only appears to have a leg up because it’s typically compared to jQuery’s $.animate(), which is, in fact, very slow. However, JavaScript animation libraries that bypass jQuery deliver incredible performance by avoiding DOM manipulation as much as possible. These libraries can be up to 20 times faster than jQuery.

The post Animating Without jQuery appeared first on Smashing Magazine.

Sep
3
2014

Testing Mobile: Emulators, Simulators And Remote Debugging


  

In the early days of mobile, debugging was quite a challenge. Sure, you could get ahold of a device and perform a quick visual assessment, but what would you do after discovering a bug?

Testing Mobile: Emulators, Simulators And Remote Debugging

With a distinct lack of debugging tools, developers turned to a variety of hacks. In general, these hacks were an attempt to recreate a given issue in a desktop browser and then debug with Chrome Developer Tools or a similar desktop toolkit. For instance, a developer might shrink the size of the desktop browser’s window to test a responsive website or alter the user agent to spoof a particular mobile device.

The post Testing Mobile: Emulators, Simulators And Remote Debugging appeared first on Smashing Magazine.

Sep
2
2014

Building A Simple Cross-Browser Offline To-Do List With IndexedDB And WebSQL


  

Making an application work offline can be a daunting task. In this article, Matthew Andrews, a lead developer behind FT Labs, shares a few insights he had learned along the way while building the FT application. Matthew will also be running a “Making It Work Offline” workshop at our upcoming Smashing Conference in Freiburg in mid-September 2014. – Ed.

Building A Simple Cross-Browser Offline To-Do List With IndexedDB And WebSQL

We’re going to make a simple offline-first to-do application with HTML5 technology. Here is what the app will do: Store data offline and load without an Internet connection, allow the user to add and delete items in the to-do list, store all data locally, with no back end, and run on the first- and second-most recent versions of all major desktop and mobile browsers. The complete project is ready for forking on GitHub.

The post Building A Simple Cross-Browser Offline To-Do List With IndexedDB And WebSQL appeared first on Smashing Magazine.

Pages:1234567...128»

Categories