Menu Search
Jump to the content X X
Smashing Conf Barcelona 2016

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

Posts Tagged ‘UI’.

We are pleased to present below all posts tagged with ‘UI’.

Developing For Virtual Reality: What We Learned

With the tools getting more user-friendly and affordable, virtual reality (VR) development is easier to get involved in than ever before. Our team at Clearbridge Mobile recently jumped on the opportunity to develop immersive VR content for the Samsung Gear VR, using Samsung’s 360 camera.

Developing For Virtual Reality: What We Learned

The result is ClearVR, a mobile application demo that enables users to explore the features, pricing, interiors and exteriors of listed vehicles. Developing this demo project gave us a better understanding of VR development for our future projects, including scaling, stereoscopic display and motion-tracking practices. This article is an introductory guide to developing for VR, with the lessons we learned along the way.

Read more...

Quick Tips Conversational Interfaces: Where Are We Today? Where Are We Heading?

Computers and human beings don’t speak the same language. So, to make interaction possible, we rely on graphical user interfaces (GUIs). But GUIs come with a natural barrier: People have to learn to use them. They have to learn that a hamburger button hides a menu, that a button triggers an action.

Conversational Interfaces: Where Are We Today? Where Are We Heading?

But with technology evolving and language recognition and processing improving, we are on a path that could make interaction with digital services more intuitive, more accessible and more efficient — through conversational interfaces.

Read more...

A Roadmap To Building A Delightful Onboarding Experience For Mobile App Users

When launching an app, you need to spend a lot of time and resources to attract users. You can pull people into your app using a variety of means, including advertising, referral programs, public relations and content marketing. But when people finally download an app, they sometimes feel abandoned. You must clearly show users why they need your app.

A Complete Roadmap To Building A Delightful Onboarding Experience For Mobile App Users

Studies reveal that 90% of all downloaded apps are used only once and then eventually deleted by users. People often abandon apps because of a poorly designed interface or an overall negative experience. Instead of having their problem solved by the app, people get confused trying to wade through a jungle of screens, menus and buttons.

Read more...

Designing Modular UI Systems Via Style Guide-Driven Development

Using a style guide to drive development is a practice that is gaining a lot of traction in front-end development — and for good reason. Developers will start in the style guide by adding new code or updating existing code, thereby contributing to a modular UI system that is later integrated in the application. But in order to implement a modular UI system, we must approach design in a modular way.

Designing Modular UI Systems Via Style Guide-Driven Development

Modular design encourages us to think and design a UI and UX in patterns. For example, instead of designing a series of pages or views to enable a user to accomplish a task, we would start the design process by understanding how the UI system is structured and how its components can be used to create the user flow.

Read more...

Retrofitting Zooming UI To Legacy Websites: An Impossible Task?

It’s well known that, in the ’80s, Microsoft and Apple made the graphical user interface (GUI), the dominant interface on desktop computers. What’s less known is that the GUI, whose navigation is based on pages and links, is not the only possible interface. And we know that finding our way in a modern GUI, whether for a website or application, is not always easy.

Retrofitting ZUIs To Legacy Websites: An Impossible Task?

One problem is of design, meaning that an interface could simply be poorly designed. But a different problem may very well be the way our brains are wired; even well-designed interfaces can be difficult to navigate and use.

Read more...

Smart Responsive Design Patterns, Or When Off-Canvas Isn’t Good Enough

Design patterns often have a bad reputation. They are often considered to be quick, lazy, off-the-shelf solutions that are applied blindly without consideration of the context of a problem. Solutions such as the almighty off-canvas navigation, the floating label pattern or carousels for featured products are some of the prominent ones.

Smart Responsive Design Patterns, Or When Off-Canvas Isn't Good Enough

This article isn’t about these patterns, though. This article features some of the slightly more obscure design patterns, such as responsive car-builder interfaces, mega dropdown navigation, content grids, maps and charts, as well as responsive art direction. Please note that this article isn’t technical; it explores interesting UX patterns out in the wild, rather than code samples. Beware: You will not be able to unsee what you are about to see, and that’s probably a good thing.

Read more...

Quick Tips Better Interface Design: Logins, Menus, Toggles And Other Fancy Modules

CodePen has become the playground for developers. The sandbox where you can build whatever your imagination fancies. Practical things, experimental concepts — it’s a treasure chest, bound to fuel your ideas.

Modal window breaking into parts as soon as a user closed the window.

For this Quick Tip, we have done some digging around and found some interesting UI demos and concepts for you to indulge in and build upon: dialog and modal windows, signup and login screens, navigation and menus, sliders and toggles. Small bits of delight that make the user’s interaction with a website or app more pleasant. Enjoy!

Read more...

Approaches For Multiplatform UI Design Adaptation: A Case Study

There is no winner in the battle between iOS and Android, and we all know that. If a product succeeds on one platform, it will undoubtedly be ported to the other. Sometimes app developers don’t even bother waiting, and release apps for both platforms simultaneously. For designers this means only one thing — they will have to adapt an application’s UI and UX to another platform while ensuring a consistent design language across the product.

Three Approaches For Multiplatform UI Design Adaptation: A Case Study

There are three different scenarios for UI multiplatform adaptation: retaining brand consistency; aligning with the conventions specific to the platform; and seeking a balance between the two. We decided to analyze these three approaches by looking at the most popular apps out there so that you get some insight into what method might work best for you.

Read more...

Sketching For Better Mobile Experiences

Mobile user experience design is maturing. One way to gauge this is to look at the tools at our disposal. Prototyping tools such as Balsamiq, Axure and Fireworks enable us to build wireframes and click-dummies, helping us to explain the targeted user experience.

Sketching For Better Mobile Experiences

Cross-browser frameworks such as PhoneGap, Zurb Foundation and jQuery Mobile help us to create prototypes using the native languages of the Web: HTML, CSS and JavaScript. We seem to be in a better position than ever to design great experiences in virtually no time.

Read more...

↑ Back to top