angular-klingon / klingon

Angular Klingon: The UI companion for the @angular/cli
https://angular.run
MIT License
189 stars 19 forks source link

Revamp angular klingon design for better user experience #90

Open sumitparakh opened 5 years ago

sumitparakh commented 5 years ago

Is your feature request related to a problem? Please describe. Currently it feels very inconvenient as a user that i have to import or create new project every time i open the project. Although the empty space around different tabs can be utilized in better ways. Hence this issue will cover and track those improvements which will improve/overhaul overall user experience of angular developer.

dince12 commented 5 years ago

I would love to get involved with this project, can try and help with the ui/ux??

sumitparakh commented 5 years ago

That'd be great @dince12 . Thanks for showing your interest.

Let me explain what problems we are facing now and how we are planning to take it forward.

Current state of the UI is, we can easily create any angular project under New tab.. But all other options such as Build, serve, test etc. are also visible or disabled even if no project is created or imported. It confuses us a bit as a developer. Logically, options such as serve, build, test etc. should be visible only if an angular project is open, right? But currently it is not happening. We want to change that experience.

In order to improve that experience, we thought of creating a workspace kind of UI which would allow user to :-

  1. Create or import a workspace(angular project) first.
  2. Allow to open recently accessed workspace.
  3. All other angular required options (serve, build, test etc.) would be visible only after user creates or opens angular workspace by following step 1 or 2.

This workspace can also be called a startup page which will be displayed every time user opens klingon (But we can also provide an option to not display startup screen next time, in future..)

I've personally thought of a workspace design in which, apart from create and import option, project & contributors details would also be displayed. We can divide it in 2 column layout:-

  1. First column would contain option to create or import angular project and also display a list of recently accessed projects.
  2. Second column would contain summarized klingon details along with logo and would also display list of great people who have so far contributed to it.

Workspace screen should not have scroll bar because, psychologically, scroll bar in a startup screen, irritates a bit. It should look as straightforward as it can be.

Let's discuss what you think about above points and what are your ideas to improve its user experience.

sumitparakh commented 5 years ago

Taking this forward.