This commit is contained in:
KorbsStudio 2023-01-25 04:28:29 -05:00
parent df45e16f19
commit 5720917fae
No known key found for this signature in database

View file

@ -40,28 +40,66 @@ ___
## In Development ## In Development
The following features are planned: The following features are planned:
- Notification System - Crash Report
- System Preference Respect [What's this?]()
- Progress indicators
- Deep Links - Deep Links
- Light Theme [Why?]() - Light Theme [Why?](#why-add-light-mode)
- Skeleton State [What's this?]() - Notification System
- Progress indicators
- Skeleton State [What's this?](#what-is-skeleton-state)
- Splash - Splash
- System Respect [What's this?](#what-do-you-mean-by-system-respect)
- Components for: - Components for:
- Sidebar
- Notifications
- Navigation - Navigation
- Notifications
- Overlays - Overlays
- Settings - Settings
- Sidebar
**What do you mean by System Preference Respect?** ### What do you mean by System Respect?
_This is currently in writing, check back later..._
**Why Add Light Mode?** A part of this function of Nexus Polestar will only be utilized on Windows and mostly macOS, as Electron's `systemPreferences` API doesn't support Linux.
_This is currently in writing, check back later..._
Basically, System Repect in Nexus Polestar will try it's best to integrate into the user's system.
_Situration 1: Low Battery_
If the system's battery becomes low, Nexus Polestar will enable it's "Power Saving" state by disabling certain features like blur composition, window transparency, notification sound, animations, and more as these functions aren't entirely nessesary for the software to serve it's purpose.
_Situration 2: Color Scheme and Theme Mode_ (Windows and macOS)
on Windows and macOS, the user can set an accent color for their operating system, Nexus Polestar will try to use the accent color they've set. Along with using the theme mode, which is handy if they use a sunset feature to auto switch between light and dark mode.
[`systemPreferences.getColor(color)`](https://www.electronjs.org/docs/latest/api/system-preferences#systempreferencesgetcolorcolor-windows-macos) (Windows and macOS)
[`systemPreferences.getSystemColor(color)`](https://www.electronjs.org/docs/latest/api/system-preferences#systempreferencesgetsystemcolorcolor-macos) (macOS)
_Situration 3: Motion and Transparency_ (macOS)
On macOS, there is an accessibility option called "Reduced Motion" and "Reduced Transparency".
If "Reduced Motion" is enabled, Nexus Polestar will disable animations.
If "Reduced Transparency" is enabled, all blur compositions and transparency of the window will be disabled. Transparency will also be disabled for other components, if used.
Also recommended by Apple Human Interface Guidlelines for [Accessibility](https://developer.apple.com/design/human-interface-guidelines/foundations/accessibility).
[`systemPreferences.getAnimationSettings()`](https://www.electronjs.org/docs/latest/api/system-preferences#systempreferencesgetanimationsettings) (macOS)
### Why Add Light Mode?
While dark mode is better it causes less eye-strain and great for those with low vision and light sensitivity, light mode does have it's own benefits and probably depends on the user.
It is ideal for accessibility to allow your users to choose between light and dark modes. Consider people who have cataracts or other vision issues who would like to use your product but are unable to do so in light mode.
So, long short, this is being added for mainly accessibility.
Learn more: https://webuild.io/digital-product-guide-dark-light-modes
### What is Skeleton State
"The concept behind skeleton screens is the use of empty pages that are progressively populated with content as it becomes available — immutable regions of a page are rendered instantly on load, appearing as neutral color blocks, and are gradually replaced with content such as images, headings, and interface labels."
This makes using a splash screen optional.
Example of a Skeleton State:
![](https://miro.medium.com/max/1400/1*18-4pGAP0Pa5040-cJ9aGg.webp)
**What is Skeleton State**
_This is currently in writing, check back later..._
___ ___
# Working in Nexus Polestar # Working in Nexus Polestar
@ -146,6 +184,7 @@ ___
### Packages Used ### Packages Used
- Distrubting with: [Electron Builder](https://www.electron.build) - Distrubting with: [Electron Builder](https://www.electron.build)
- For Blur composition effect: [Glasstron Clarity](https://www.npmjs.com/package/glasstron-clarity) - For Blur composition effect: [Glasstron Clarity](https://www.npmjs.com/package/glasstron-clarity)
- For Titlebar Integration: [Electron Titlebar Respect](https://www.npmjs.com/package/electron-titlebar-respect)
### Scripts ### Scripts
- Navigation: [Tabbed Navigation using Vanilla Javascript](https://codepen.io/alpha1337/pen/mxWBpq) - Navigation: [Tabbed Navigation using Vanilla Javascript](https://codepen.io/alpha1337/pen/mxWBpq)