popcodeorg / popcodeorg/popcode

Header Bar Updates - Clearer Project Workflow

Aperta
#1,140 0 commenti 0 reazioni 0 assegnatari Vedi su GitHub

Nessuno ha ancora preso questa issue.

design enhancement ux
Lingua principale
JavaScript
Stelle
191
Fork
143
Merge medio
4g 11h
PR unite (30g)
5

Descrizione

I have a few suggestions for a clearer project workflow an ultimately a more familiar experience when saving and working with projects. Also some visual design tweaks to ultimately make the header bar feel less overwhelming and more familiar.

header bar updates - popcode-01

Flow and Layout Changes

  • Add a distinct "title" that can be edited instead of using "Page title."
  • This includes an icon to let users know it can be edited and the "inline-edit" experience.
  • Add a "saved" indicator once the project has been named and is being worked on.
  • Separate current project actions from new project actions (left and right side).
  • Make "New Project" disabled in initial state and add a popover to let users know why it's disabled.
  • Move "zoom button" into hamburger menu. (not a popular action)

Visual Design Changes

  • Add "line" separators between logical groupings of actions
  • Add "button" outline for buttons
  • Lighten up the text and consider not using bold on everything.
  • Remove the "popcode" text in favor of logo to make room for actions.
  • I personally like the "chevron-style" dropdown icon. Just a personal taste thing.

Guida per i contributori

Nessuna guida per i contributori indicizzata per questo repository

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Direzione di ricerca

Non sono indicati file o test. Inizia individuando l’implementazione della barra dell’intestazione e confrontandola con il riferimento di design allegato; quindi suddividi i suggerimenti sul workflow e sull’aspetto visivo in modifiche concordate e verificabili. Il lavoro può dirsi completato solo quando sono definiti esplicitamente l’ambito e la verifica delle azioni richieste per il progetto e degli aggiornamenti visivi.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Valutazione

Stack tecnologico
javascript
Ambito
design, frontend
Tipo di issue
Funzionalità
Difficoltà
5/5
Tempo stimato
Più di una settimana
Stato di attività
Ferma
Chiarezza
Da chiarire
Idoneità per principianti
25/100

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.