popcodeorg / popcodeorg/popcode

Header Bar Updates - Clearer Project Workflow

Offen
#1,140 0 Kommentare 0 Reaktionen 0 zugewiesene Personen Auf GitHub ansehen

Dieses Issue hat noch niemand übernommen.

design enhancement ux
Vorherrschende Sprache
JavaScript
Sterne
191
Forks
143
Ø Merge
4 T. 11 Std.
Gemergte PRs (30 T.)
5

Beschreibung

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.

Beitragsleitfaden

Für dieses Repository ist kein Beitragsleitfaden indexiert

Erste Schritte

  1. Lies das ganze Issue und danach den Beitragsleitfaden des Projekts.
  2. Schreib ins Issue, dass du es übernimmst — das erspart doppelte Arbeit.
  3. Forke das Repository und arbeite in einem Branch.
  4. Öffne einen Pull Request, der die Issue-Nummer nennt.

Rechercherichtung

Es werden keine Dateien oder Tests genannt. Beginne damit, die Implementierung der Headerleiste zu finden und sie mit der beigefügten Designreferenz zu vergleichen; unterteile anschließend die Workflow- und visuellen Vorschläge in vereinbarte, testbare Änderungen. Als abgeschlossen gilt die Arbeit erst, wenn der Umfang sowie die Überprüfung der angeforderten Projektaktionen und visuellen Aktualisierungen ausdrücklich festgelegt sind.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Bewertung

Tech-Stack
javascript
Bereich
design, frontend
Issue-Typ
Feature
Schwierigkeit
5/5
Geschätzter Aufwand
Über eine Woche
Aktivitätsstatus
Veraltet
Klarheit
Muss geklärt werden
Anfängerfreundlichkeit
25/100

Neue Issues direkt in Ihr Postfach

Eine kurze Übersicht über anfängerfreundliche GitHub-Issues.