KittyCAD / modeling-app

The KittyCAD modeling app.
https://kittycad.io/modeling-app/download
MIT License
372 stars 31 forks source link

First impression glow-ups ✨ #2034

Open JBEmbedded opened 6 months ago

JBEmbedded commented 6 months ago

In no particular order

### On our website
- [ ] Add an image preview to downloads page https://zoo.dev/modeling-app/download (might be worth considering having one downloads page for all of our products vs per project (I like how figma does this)
### Modeling App icon
- [x] Adjust Icon to have fewer words (either just ZOO and we use the KittyCAD yellow for now, or create a unique one)
### In Modeling App main home base
- [ ] https://github.com/KittyCAD/modeling-app/issues/2133
- [ ] Ability to group projects into folders with previews of all (I like the format Figma does for this)
- [ ] https://github.com/KittyCAD/modeling-app/issues/2337
- [x] Add a top or side navbar that for now has helpful pages linked like Release Notes, Keymap, KCL Docs, KCL Samples (and can expand to other things around collaboration as well once we add more of those features)
- [ ] https://github.com/KittyCAD/modeling-app/issues/2117
- [ ] Ability to add tags to projects.
- [ ] Add design bells and whistles so the main dashboard has more cohesion to our website.
- [ ] "Recently Edited" section at the top or bottom with the 4 most recent, then "your files" or "all files" separate.
- [ ] Share button that can let you send a project, etc.
- [ ] https://github.com/KittyCAD/modeling-app/issues/2336
- [ ] Rename Command Palette to Search or Find or Command (if we don't have a separate search bar)
- [ ] https://github.com/KittyCAD/modeling-app/issues/2300

Misc questions/thoughts:

adamchalmers commented 6 months ago

I really like the ideas to improve the home screen aka the project picker. Especially having a screenshot of each project.

franknoirot commented 6 months ago

Nice a lot of cool ideas here for the Modeling App home. I'll mock something up with all this in mind and land it here; Home has been next on my hit list for glow-ups after I get the modeling view looking a bit better. Everything in your notes I think I can do but I may have to defer on tags. There's a rabbit hole of UX around tags that will require more thought. But I might be able to swing it, I have a few ideas. I'll convert your bullet points to individual issues as I get to them.

Preview image of project on each project card as default, with icons to be able to choose whether you want projects displayed as a grid or as list. Image preview hidden in list view. Yeah I dig that idea, and I don't think it'll be too hard to get a first version of it where we save the last frame from the feed as the screenshot before the user quits or goes back to home.

Background color in light mode looks yellow to me, and dark mode shows up as dark green for me, so need to think a bit on colors here. For sure the gray color ramp hasn't been migrated to the new one that has no saturation and is pure white at the top end, so it still has a little tint to it that I've gotta get rid of.

Share button that can let you send a project, etc. I'm not sure what it would mean to share a project at the moment. We're not storing any project information anywhere on the web at the moment so it isn't possible to link to a project and share it. The two things I can think of a Share button doing are:

  1. If the project is set up with version control and has a remote like GitHub, the link could lead to the remote repository
  2. When we have a web version with remote web projects, a link with sharing permissions and all that, but that would have to be a future implementation.
franknoirot commented 6 months ago

Do we have a keymap?

No but we definitely should. In those newest mockups of the editor interface that is meant to be an option under the new question mark help icon in the lower right.

Customize shortcuts (like command L starting a line)

100%. We don't have a unified keybindings system and we should. I'll make an issue for this.

Consider using more common phrasing like "viewport" or "3d viewport"

Is this a note on the wording in the onboarding, or something like in the settings descriptions that we use a more confusing term? Happy to change it.

Add "Mouse Controls" to settings (we think this was before but isn't now)

Ah yeah Mike ran into this as well. It's a User-level-only setting, so if you're in a project it's easy to miss that you have to click into the User tab of the settings to be able to change them, but they're still available. I'll find a solution to make this problem of setting discovery between levels easier, that's definitely a design oversight on my part.

Ability to customize mouse controls

So you'd like the ability to click a "Set orbit controls" button, then perform the combination of keys and mouse presses that you like to save for that interaction?

Ability to hover over line and get the midpoint, so you can just click the midpoint

A good UX that has some surprising technical difficulties I've discussed with @Irev-Dev. I definitely agree we will need this.

Fix the way the grid zooms

Agreed, this is also in Jess' notes from that demo

JBEmbedded commented 5 months ago

Another idea for Modeling App Home as well as things like onboarding, side navs, pop up windows, etc. @franknoirot - is to play around with more glass/glassmorphism elements. When done subtly, it really modernizes things.

Some inspo: (will be adding to this list as I see things) Ilya Miskov does this super well...

franknoirot commented 5 months ago

Ability to search for a project in Command Palette

Is this so that you can operate on a project; like open, rename, or delete it? You can do this today, but you first choose what command you want to perform, then search for the project you want to perform it on.