Desktop vs. Mobile: Comparing the UI/UX Experience (Windy.com)
Hey there! Today we’ll be comparing a desktop vs. mobile experience, using the website https://www.windy.com. I found this website years ago when we were having a particularly bad year in the US with hurricanes — Windy helps visualize wind movements in real-time, letting you track masses of moving air world-wide. I really enjoy the experience on both desktop and mobile, but funnily enough, the mobile website makes for a better overall experience.
Above is the page you land on when you first arrive on the desktop version, a general overview that defaults to the wind movements setting. Windy offers a myriad of different functions, like tracking precipitation, cloud movements, wave heights, and air quality on both desktop and mobile.
The page organization above is the mobile experience on an iPhone X — which I personally think is a more immersive experience than the desktop version. Instead of offering all the options on the top left, Windy places everything under the menu icon which is much more easily navigatable on mobile than on desktop.
While the lower-left icons on desktop do make sense, I prefer the further clarification of the icon and words together on mobile, with the extra settings clustered under each category. The extra options on the bottom left of the desktop menu might do better if they were toggleable from the menu instead of adding more information and visual complexity to the overall view.
Above, I’m working through the menu on desktop to see the different settings for the area: wind, clouds, waves, and air quality. I really enjoy the way you can easily visualize the movements within each category on both mobile and desktop, overlaid with the different color settings with the key on the bottom right.
Next, we’ll take a look at another function on the website: the projected weather patterns for wind movements.
Windy offers projections within each category. We can see here that we’ll get some stronger winds over the ocean on Saturday, represented both by the warmer colors and the longer white wind lines on the map.
Here we have the same function, but on mobile. I preferred the mobile experience again here; the scrolling function was a nice touch and the centralized time pointer felt more helpful than the moving pointer on desktop. The five icons on the bottom right are simple, to the point, and don’t get in the way of the overall view as the projected weather loads in. It also seems to be a smooth loading experience on mobile than on desktop.
Finally, we’ll take a look at the 10,000-mile overview — which was really the only place desktop won over mobile. On desktop, as expected, you can get a full picture of wind movements across multiple continents, while on mobile, you can only zoom out so much. The screenshot on the left represents the absolute most you can zoom out on the mobile website, which gives you a good slice of ocean and coast but not much else. The “download app” button also happens to be more prominent here for some reason (and changes color as you shift your view, regardless of which setting you have on). The ability to zoom out more (and shifting the “download app” button to the menu instead) would truly help the mobile version continue to shine.
