Come disegnare un set di pulsanti gerarchici e sembrare meno offensivo di quello che è?


17

Sto cercando di creare un set di pulsanti che può essere utilizzato per spostarsi tra i dati gerarchici e sembra una svastica. Non sono sicuro di come correggerlo.

inserisci qui la descrizione dell'immagine

Nell'immagine sopra se è stato selezionato "Pannello" e si preme il pulsante in alto, selezionare "AnimatedPanel". Se si fa clic sul pulsante sinistro, selezionare "Script". Se si fa clic sul pulsante destro, nulla cambierebbe poiché il pannello è l'ultimo elemento dell'elenco. Se si seleziona il pulsante in basso, verrà selezionato "EventHandler".

Il set di pulsanti si troverà a sinistra dell'etichetta. L'etichetta e il pulsante verranno visualizzati quando viene selezionato un elemento. Ad esempio, in una pagina Web potrebbe esserci un elenco di voci di menu verticali o orizzontali. Il set di pulsanti e l'etichetta si posizionerebbero sopra il menu selezionato. Quindi premendo "in" si seleziona la prima voce di menu. Selezionare "sinistra" o "destra" per spostarsi tra le voci del menu. Spero che abbia un senso.

Qualche suggerimento su come renderlo meno qualunque cosa sia?

Maggiori dettagli per @PremierBromanov:
Il modo in cui ce l'ho ora ho 3 etichette tutte in fila come così "Up" "L" "R" "Panel".

inserisci qui la descrizione dell'immagine

Sto usando i termini "su", "sinistra" e "destra", ma "su" è in realtà "uscire dalla riga corrente e tornare alla riga precedente". Questi termini si basano vagamente su come viene visualizzato in un layout simile a quello orizzontale (sebbene in verticale non abbia più senso).

In XML usano termini come nodo di diramazione e nodi foglia. Un ramo ha o può avere nodi foglia. I dati gerarchici usano anche i termini nodo padre e nodi figlio. In tal caso, hai antenati e discendenti. Hai anche fratelli. Sono nodi figlio che condividono lo stesso genitore.

Quindi nell'ultimo caso potresti avere genitori, fratelli precedenti, fratelli successivi e discendenti dell'attuale nodo figlio. Potresti anche avere Parent Branch, precedente a sinistra, foglia successiva. In questo caso se una foglia ha delle foglie sarebbe un ramo. Quindi ramo genitore, foglia o ramo precedente, foglia o ramo successivo e foglie del ramo corrente.


1
Prova a usare due frecce diagonali.
Paolo Gibellini,

7
Curiosità: una svastica rivolta a sinistra è in realtà un simbolo di pace nell'Induismo e viene prontamente utilizzata sulle mappe per rappresentare i luoghi di culto. Una svastica di destra è un simbolo del male ma non è ancora offensiva nell'Induismo.
John Dvorak,

3
Entrambe le svastiche sono state usate come segni di buona fortuna nella cultura occidentale dagli inizi del 20 ° secolo in poi ( wiki ). Fino a quando qualcuno è arrivato e ha rovinato un po 'le cose.
Vincent,

Hai provato a creare un semplice sistema di freccia in alto a sinistra in alto a destra? Potrebbe avere più senso visivamente mentre attraversi la struttura del file e sarebbe più simile a un "+" e non a una svastica. Su e giù si sposterebbero da "Pannello" a "script" e sinistra e destra usciranno e entreranno rispettivamente.
Premier Bromanov,

1
Non è una svastica, mancano due gambe, non credo che dovresti preoccupartene, solo un nazista lo noterà, ho letto il titolo della tua domanda e poi ho dato un'occhiata al tuo set di pulsanti e io non ho ottenuto l'offensiva (pensavo volessi dire che era troppo brutta: P non lo è), ho dovuto leggere la tua domanda per sapere cosa intendevi per "offensivo", dal modo in cui ho studiato la seconda guerra mondiale per 10 anni, anche così, non sono riuscito a individuare la svastica
Kyle

Risposte:


32

Il tuo concetto di freccia e ciò per cui prevedi di usarlo sembrano appropriati. E da quello che posso vedere, immagino che tu non abbia comunque molto spazio per le icone.

Forse ciò che potrebbe aiutarti è semplicemente usare frecce più spesse e curve per nascondere quell'effetto che non ti piace.

Di seguito è riportato un breve esempio:

Potrebbe essere necessario regolare le frecce in base alle proprie preferenze e chiarezza quando di dimensioni ridotte. È lo stesso concetto del tuo, ma frecce diverse.

frecce di esempio in scala di grigi

esempio scala di grigi grande

Le frecce possono anche essere di diversi colori:

esempio frecce blu

esempio freccia blu grande


2
Penso che le frecce curve funzionino bene anche senza cambiare i colori. Bella idea +1
Aistis,

A dimensioni ridotte, potrebbe anche essere preferibile rendere le frecce curve dello stesso colore di quelle diritte.
trentatré

1

Potresti prendere in considerazione un approccio più semplice, "piatto", usando pulsanti che attraversano puramente l'elenco su e giù, indipendentemente dalla profondità della gerarchia, e fornendo all'utente la possibilità di regolare la velocità della traversata, ad esempio quattro pulsanti :

  • [più veloce]
  • [su]
  • [giù]
  • [giù più veloce]

"su" e "giù" attraversano elemento per elemento, mentre i pulsanti "più veloci" attraversano cartella per cartella.


Perché no Up foldere Down folder. E come dovrebbero essere disegnati come richiesto nella domanda?
Mensch,

Vorrei provare Up Folder : doppio gallone rivolto verso l'alto. Su : singolo chevron 'su'. Giù : singolo gallone rivolto verso il basso. Cartella in giù : doppio chevron 'in basso'.
Matt Smith,

Buona idea. Fuori e dentro. Quindi indovino qualcosa del tipo, ^ << >> \ / dove "^" e "\ /" sono centrati sopra e sotto il "<< >>".
1,21 gigawatt

Sì, è come il noto modello di impaginazione, solo verticale.
Matt Smith,
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.