NewsBlur/blog/_posts/2022-07-01-dashboard-redesign-2022.md

38 lines
2.6 KiB
Markdown
Raw Normal View History

---
layout: post
title: "2022 redesign: new dashboard layout, refreshed stories and story titles, and entirely redrawn icons"
tags: ['web']
---
2022-06-30 16:03:19 -04:00
The launch of the new [Premium Archive subscription tier](/2022/07/01/premium-archive-subscription/) also includes the 2022 redesign. You'll see a third dashboard layout which stretches out your dashboard rivers across the width of the screen.
<img src="/assets/premium-archive-dashboard-comfortable.png" style="width: calc(140%);margin: 12px 0 12px calc(-20%);max-width: none;border: none">
The latest redesign style has more accomodations for spacing and padding around each story title element. The result is a cleaner story title with easier to read headlines. The author has been moved and restyled to be next to the story date. Favicons and unread status indicators have been swapped, and font sizes, colors, and weights have been adjusted.
<img src="/assets/premium-archive-dashboard-compact.png" style="width: calc(140%);margin: 12px 0 12px calc(-20%);max-width: none;border: none">
If you find the interface to be too airy, there is a setting in the main Manage menu allowing you to switch between Comfortable and Compact. The compact interface is denser than before, giving power users a highly detailed view.
Transitions have also been added to help you feel the difference. And there are new animations during many of the transitions that accompany changing settings.
<p>
<video autoplay loop playsinline muted width="500" style="width: 500px;border: 2px solid rgba(0,0,0,0.1)">
<source src="/assets/premium-archive-grid.mp4" type="video/mp4">
</video>
</p>
And lastly, this redesign comes with a suite of all new icons. The goal with this icon redesign is to bring a consistent weight to each icon as well as vectorize them with SVG so they look good at all resolutions.
<img src="/assets/premium-archive-manage-menu.png" style="width: 275px;border: 1px solid #A0A0A0;margin: 24px auto;display: block;">
A notable icon change is the unread indicator, which now has different size icons for both unread stories and focus stories, giving focus stories more depth.
<img src="/assets/premium-archive-unread-dark.png" style="width: 375px;border: 1px solid #A0A0A0;margin: 24px auto;display: block;">
Here's a screenshot that's only possible with the new premium archive, complete with backfilled blog post from the year 2000, ready to be marked as unread.
<img src="/assets/premium-archive-unread.png" style="width: 100%;border: 1px solid #A0A0A0;margin: 24px auto;display: block;">
I tried to find every icon, so if you spot a dialog or menu that you'd like to see given some more love, reach out on the support forum.