There has been some debate in the development community between the [“tradeoffs in server side and client side rendering.”] (https://medium.com/@cramforce/tradeoffs-in-server-side-and-client-side-rendering-14dad8d4ff8b) As a UX designer working at an Ember shop that focuses on rich client experiences, I’ve observed the benefits of single page web applications, from a design perspective.
The best kind of user interface is one where the system remains transparent, and moves the user fluently through relevant prompts to accomplish the task at hand. That experience can only be as good as the tools we have to shape and elevate that participation. At DockYard, we design and develop single page web apps using Ember as our client-side framework, because it allows for greater clarity of interaction, while keeping the technology transparent.
A single page web app is a webpage that can update contents within the page without refreshing the entire browser window. Because the server doesn’t dictate the display, the “client,” or browser, determines how to represent it. Only the data associated with the selection is changed to reflect the action.
You can imagine how beneficial that real time feedback is on the user side of the experience. Whether aware of it or not, this creates a more immersive experience, and enables the user to better grasp the information by directing attention to content. There is more opportunity to nest information which alleviates information overload, and animation simplifies complexity while still engaging the user.
To do this well, good information architecture and content organization are imperative. Functionality and interaction must be part of the architecture, but not interrupt the flow and navigation. The visual design and communication must be clear and directive. The design supports self directed navigation and the process is not disrupted by the reload of a page. Creating this kind of real time response in the browser is the result of better, faster performance, bringing us closer to a native feel from the web.
[Learnivore] (https://learnivore.com/) is a website that connects teachers and students searching for instruction across many disciplines. The search page is one of the largest hubs in the Learnivore experience. This [“complex search”] (http://reefpoints.dockyard.com/2015/01/07/complex-search-pages-feel-better-in-ember.html) filters by type of instruction, location, rate, price, qualifications, and more. The results change dynamically, reflecting the filter selection, as demonstrated in the video above.
Good design empowers the user to make the choices they need to accomplish their goals. It promotes communication and supports informed decision making through real time response. The single page web app model and the technologies to create and innovate with it are at the forefront of mobile and web design and development. It is a technology that not only provides opportunities for creativity and innovation for designers and developers alike, it constructs a more informative and cooperative experience for our users.
