Do good UX guidelines exist against little JS windows inside the browser

I encounter a lot of web applications that essentially implement a small windowing system inside the browser. On you web page there exist a number of little boxes that look like windows, which can be moved, re-sized, closed, etc. In almost every situation I have seen, this is a very bad idea which violates many of the design principles talked about on this site. For example:

  • You can open a little window on some information, but you can’t bookmark it to return later
  • It usually violates the “don’t break my back button” rule.
  • You can’t use standard browser tabs with these applications. Open in new window/tab never works.
  • You can’t open different parts of the application on different monitors. It all needs to exist in a single rectangular area which might be stretched to be bigger than all the monitors, but this is a huge inconvenience.
  • These little windows never work as well as browser tabs, and don’t mix well with other applications

This is just a sample list — I have not done any in-depth study of the problem. Are there serious guidelines that make it clear that this sort of thing is a really bad idea? Or am I mistaken, and there really are good reasons for doing things this way?

The problem as I see it, is that this sort of UI looks very good to the people who purchase applications for companies to use. Use of Flash or HTML5 to make little windows that can be moved around that page gives the superficial feeling that it is a good GUI. There usually nice graphics, and it has a polished look. But … the usability sucks when you actually have to use it.

I think it would be far better to implement with a REST approach that uses real browser windows/tabs instead of the little JavaScript imitation windows. One the applications uses a flash based UI that displays the working form as a pop-up windowlet on top of other information which is no longer relevant to using this form. Most of the time in the application is spent in a pop-up form. And there is no way to bookmark or refer anyone to it … you always have to enter the root of the application and browse your way back to that particular document. Is there a good resource for explaining to people the problems with this kind of user experience?

Are there guidelines on interaction design to prevent repetitive strain injuries for users?

With so much of the digital and web applications focusing on the mobile platform, and so much of the revenues from companies generated from ‘edutainment’ related applications, I am wondering what the future impact of young people interacting with mobile applications and being asked to develop interactions that involve a lot of repetitive motions (e.g. mobile games that involve constant tapping or rotation of thumbs from virtual controls).

Even though there are probably some guidelines for physical products for children regarding ergonomics and there are also methods for preventing injury in music (like the Alexander Technique), I think that this is still a very immature area for digital design and perhaps more needs to be done to help improve ethical design practices.

The question is, are there known or published guidelines for designing digital interfaces that help reduce the physical impact on users (e.g. Augmented Reality improvements to reduce dizziness and motion sickness), especially when it comes to repetitive motion that can cause RSI?

Are there any rules or guidelines for large character races?

I’m designing some custom races for my campaign and I’d like to allow large size characters. It seems that large characters are discouraged for some reason and although I’d like to know why what’s more important is finding some official rules or guidelines on how to create large character races like minotaurs, half-ogres, centaurs, etc.

Angular naming guidelines: why must everything be a “XXXservice” or “XXXcomponent”?

I’m struggling about this topic for a while and I think I can’t wrap my head about the angular style naming conventions. My question is: why is everything called a service?

I’m a backend-guy, and in the backend I have – for example – a UserRepository which accesses the database and a UserService hich holds the business-logic. So I use the sufix “Repository” for a data access layer and “Service” for business logic.

Moving to angular, it confuses me that everything must be a service, according to the style guide. I would like to have a UserApiClient which connects to the api and a UserService which holds business logic.

In the same manner I would like to have a UserDetailsPage, UserNameComponent and UserEditForm instead of a “UserDetailsComponent”, “UserNameComponent” and “UserEditComponent”.

I would like to have more sufixes to structure the type of my classes then “service” and “component”.

By the way, I know that I can name my classes whatever I want – but it confuses me, that angular is so strict about this topic: the style guide ist very clear and the cli doesn’t event let me choose the sufix for my classes. Renaming everything manually after creating via cli or creating everything manually couldn’t be the answer…

Is this really a concern or do I just have to “accept” the style guide as it is…? Am I seeing things wrong or not “the angular way”?

Thanks for clearing this up!

C# extension methods design patterns and usage guidelines?

C# extension methods have seen a rise in usage over recent years. The offical microsoft guidelines on usage state: “In general, we recommend that you implement extension methods sparingly and only when you have to” The extension method guidelines.

On the other hand Microsoft are now using them heavily in dot net core (see the microsoft extensions name space). This is particularly prevalent is asp core where the initializaion of the IServiceCollection is implemented in extension methods, for example see The service collection service extensions. Dot net core tutorials has an article listing this as a design pattern suggesting that it is best practice. Quite a few popular nuget packages also use this method to initialise services: Swagger is configured this way microsoft docs as well as mediatr their implementation

Should the guidelines be updated or should this practice be avoided? If the guidelines are to be updated what should they be?

Magento 2. Technical Guidelines. Module Version Dependency Question

I’m looking at the offical docs here

Why is it that when changing the preference of a class marked with @api you can depend on a MAJOR version but when you change the preference of an interface marked with @api you have to depend on a MINOR version release. Is it not kinda the same thing?

Same thing goes for implementing an interface (depend on MINOR) and extending a concrete class (depend on MAJOR) both marked with @api

What is the reasoning behind this?

IMHO implementing an interface should not make me more dependent of a module than extending a concrete class.

Guidelines on using hyphenation in interactive design

It’s a well established recommendation for publications containing masses of continuous text to use hyphenation.

Are there any ideas or guidelines on how hyphenation should be (not) used on interactive elements of UI or those that do not represent part of text content? For example, when designing 1) a menu 2) sitemap 3) sidebar etc.

The search didn’t give me anything on this subject. I think mainly of web interfaces here but it may be interesting how this may be applied to app design too.

when using material design guidelines do you use exact heights for sections?

My question is if everything is suppose to be in 4px or 8px increments does that mean even the height of sections or containers? For instance if you wanted to have a section that filled the viewport you would set that section to 100vh. However that would break the baseline grid. I’m just confused because some of the guidelines seem to be counterproductive to responsive design. For instance setting an exact container / section height would mean resizing them all at specific breakpoints.