Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fleet UI Refresh #38

Closed
6 tasks done
noahtalerman opened this issue Nov 13, 2020 · 1 comment
Closed
6 tasks done

Fleet UI Refresh #38

noahtalerman opened this issue Nov 13, 2020 · 1 comment
Labels
~spiffier Improvements to UX or look and feel
Milestone

Comments

@noahtalerman
Copy link
Member

noahtalerman commented Nov 13, 2020

This issue describes Fleet DM’s project to “makeover” the Fleet UI. This is roughly a 2.5-week process with a focus on delivering UI design assets and implementing them via front end PRs.

Goals

This project is about dusting off the cobwebs, a sensible top, a professional haircut, and designer shoes. There will be no changes to underlying functionality or what’s possible in the UI.

Steps

  • Step 1: Discovery period. Explore competing products and identify similar improvements that can be made to Fleet.
  • Step 2: @edamamedesign select 2-3 pages and creates wireframes.
  • Step 3: @noahtalerman and @edamamedesign review wireframes to define final outputs for high-fidelity mocks.
  • Step 4: @edamamedesign creates Figma based high-fidelity mocks.
  • Step 5: @noahtalerman begins implementing mocks by submitting front end PRs
  • Step 6: Finish design work and front end implementation of remaining pages in tandem

Completion status

Page Mockups Front end
404 done in progress (open PR)
500 done in progress (open PR)
set up (oboarding) done merged (ready for review)
log in done in progress (open PR)
hosts done merged (ready for review)
query - manage not started merged (ready for review)
query - edit done merged (ready for review)
labels - new done merged (ready for review)
labels - edit done merged (ready for review)
packs - manage not started merged (ready for review)
packs - new not started merged (ready for review)
packs - edit not started merged (ready for review)
admin - manage users done merged (ready for review)
admin - app settings done merged (ready for review)
admin - osquery options done merged (ready for review)
user settings not started in progress (open PR)
@mikermcneil mikermcneil added enhancement ~spiffier Improvements to UX or look and feel and removed enhancement labels Nov 19, 2020
noahtalerman added a commit that referenced this issue Nov 20, 2020
This is the first PR as a part of the Fleet UI Refresh #38.

Changes include:

- Add Nunito Sans font files and modify global styles to reflect the font change.
- Modify global font variables to reflect new sizing and weight naming conventions.
-- New sizing and naming conventions:
--- SIZE: xx-small: 12px, x-small: 14px, small: 16px, medium: 20px, large: 24px, x-large: 28px
--- WEIGHT: regular: 400, bold: 700
- Remove the old Oxygen font files.

Changes to other style sheets reflect the changes to the new font sizing and weight naming conventions for global variables. The changes don't necessarily use the correct size (as illustrated by mockups). Those "up to spec" sizing changes are to come.
noahtalerman added a commit that referenced this issue Nov 23, 2020
This is the second PR as part of the Fleet UI Refresh #38.

The goal of this PR was to insert all updated Fleet assets and remove all old assets. More style changes, including the exact sizing and placement of the new images, will occur in a future PR.
@mikermcneil mikermcneil added this to the 3.x.x milestone Nov 24, 2020
noahtalerman added a commit that referenced this issue Dec 2, 2020
This PR is part of the UI Refresh #38.

The goal of this PR is to update the styles of the Fleet setup (onboarding) flow.
@noahtalerman
Copy link
Member Author

noahtalerman commented Dec 8, 2020

Progress update

I've listed the known issues that are remaining or those that have been recently discovered:

@zwass zwass modified the milestones: x.x.x, 3.5.0 Dec 10, 2020
noahtalerman added a commit that referenced this issue Dec 19, 2020
…list and users list. (#139)

The final PR for the UI Refresh #38.

- Complete UI issues caught during the Dec. 09 QA pass.
- Update button and color styles, including hover and active states, to align with the mockups.
- Update status labels in the hosts list and users list. The status label now includes a colored circle along with a text description.
- Fixes #138.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
~spiffier Improvements to UX or look and feel
Development

No branches or pull requests

3 participants