[discussie] Welke GUI (hoe ontwerp jij een gui)

[Zoppie]

Hai,

Elke keer als ik weer een nieuwe programma moet maken(in c++ mfc of vb) heb ik steeds de volgende vraag:
Hoe moet de user interface eruit zien?

In 9 van de 10 gevallen gaat het om programma om veel data in te voeren en te verwerken. Daarnaast probeer ik het 'drieklikjes' principe te hanteren (nooit meer dan drie muisklikken nodig om de benodigde informatie te bereiken).

Op dit moment ben ik erg 'outlook minded', omdat ik dan de diverse hoofdonderdelen kan scheiden (geheel links) en de views/formulieren rechts kan houden, met daartussen de eventuele subonderdelen.

Zoals alle programmeurs ben ik redelijk eigenwijs en zal ik niet zomaar alles overnemen, maar graag zou ik jullie mening wel eens willen horen over userinterfaces.

[Rival24]

Dat van die drie klikjes is wel mooi bekeken, maar ik denk dat je de meer geavanceerde instellingen of opties wel wat verder weg kunt stoppen, want het programma moet natuurlijk in het hoofdscherm wel overzichtelijk blijven. Maar even voor de duidelijkheid, ik heb nog nooit geprogrameerd en dit is dus maar een mening

[Verwijderd]

Ik ben erg voorstander van een mooie werkbalk, en liefst zo klein mogelijk menu's(hoe minder opties hoe beter)...

[DroogKloot]

Mijn motto (niet dat ik veel GUI's ontwerp, ben meer een commandline mannetje ): keep it simple stupid. Met andere woorden, strak en overzichtelijk Tunneling probeer ik zoveel mogelijk te voorkomen, en ik probeer me te houden aan de regel "ESC == niveau terug". Consequent zijn bij alle elementen is ook erg belangrijk.

[Crazy D]

Ik schrijf veel maatwerk varianten van bestaande software, die klanten nu gebruiken. Over het algemeen beginnen we een GUI dan ook als afgeleide van de standaart, hetgeen waar ze mee vertrouwt zijn, en voegen daar vaak wat handige extraatjes aan toe, om met enter door de velden heen te kunnen gaan. Naja misschien niet standaart windows, maar de klant is koning en zij moeten er mee werken. En zo gaat het eigenlijk bij het grootste deel van wat we maken. Voordeel is misschien dat wij (collega's met wie ik direct samenwerk) ook ervaring hebben vanaf de gebruikerskant (ik heb zelf bv ook een tijdje orders in zitten kloppen) en daardoor merk ik dat we dingen iets makkelijker inschatten als handig bruikbaar (of juist niet natuurlijk). Ik heb iig nog nooit commentaar gehad om m'n GUI's, wel zeer regelmatig complimentjes (hoewel ik er voor mezelf vaak niet eens 100% over tevreden ben, maar blijkbaar is het mierenneuken als je een dag extra besteed aan iets wat een klant allang als "erg handig" beschouwt )
Voor nieuwe programma's gaat het bij ons vaak om een stukje onderhoud (instellingen, koppelingen, default waardes), daar probeer ik het altijd zo simpel mogelijk te houden, hoewel de meeste klanten (uit ervaring...) dat niet zo boeit, omdat dat eenmalig is, en 1 klikje extra dan niet zo heel erg is, en uiteindelijk moet de echte aktie onder 1 knop komen te zitten (batchverwerking van dingen), naja 1 knop kun je moeilijk een GUI noemen .
Ik probeer de GUI altijd wel een beetje up to date te houden, zoals tegenwoordig een beetje outlookstyle, en wat flatbuttons hier en daar, het oog wil ook wat , maar prioriteit vind ik gebruiksgemak.
Ik denk dat als het om programma's gaat die niet specifiek voor 1 klant zijn, de GUI misschien iets belangrijker is, in die zin, dat het handig moet werken, wel een aantal standaart dingen in zich hebben zodat mensen die een gemiddelde windows gui vrij makkelijk met het programma overweg kunnen, en wel een beetje een moderne look hebben (het gaat dan wel over wat het programma doet, maar een stoere functie ziet een klant niet, een button die net niet mooi is uitgelijnt wel, en 't zijn van die kleine dingetjes die gaan irriteren, ook al is het totaal pakket nog zo mooi).

[edit]ik zie dat ik weer lekker langdradig ben vandaag

[MisterData]

Als ik een complexe GUI moet maken (bijv. voor ingewikkelde data-entry) vind ik het altijd een stuk overzichtelijker als er een treelist naast staat omt te navigeren. Dit soort boomstructuurtjes zijn goed voor het overzicht. Echt een hekel heb ik aan tig tabbladen op een scherm. Als je puur dataentry moet doen dan zou ik een tabel maken emt twee kolommen : eentje voor de veldnaam en eentje voor de waarde. Dan een paar knopjes eronder voor editten enzo en dan is het erg overzichtelijk.

Je kan het overigens nog pro-microsoft maken door dit soort tabellen in te bouwen in een treelist , net als in Office XP en ik geloof ook in Visual Studio. Gewoon zorgen dat het er netjes uitziet, geen overbodige troep erin en een beetje snel

[stylee]

Ik ga ook vaak voor die outlook-stijl achtige dingetjes. Voor de rest heb ik niet echt bepaalde regeltjes waaraan ik me houd, ik ga gewoon af op mijn gevoel (en de klant uiteraard). Zoals CrazyD_at_work al zei, wil de klant weleens van die rariteiten hebben (idd zoals enter voor volgend veld...), dan bouw je dat gewoon in.

Mischien is het wel leuk als je ff een voorbeeldje post van een van je GUI's.

Op dit moment ben ik bezig met een administratie/faktureer programma voor een klant en het ziet er ongeveer als volgt uit: [ link ] (die rechterkant is niet af, maar het wordt ongeveer zoals de nieuwe Office XP Quickbar stijl... ik dacht er ook aan om de menus in Office XP stijl uit te voeren, maar heb idee toch maar geschrapt )

edit: hoe gaan jullie btw om met puur het ontwerpen van een GUI, word er eerst een schetje op papier oid gemaakt voordat jullie daadwerkelijk aan de bouw beginnen? Ikzelf vind het veranderen van een GUI behoorlijk lastig in vergelijking met het van de grond af opbouwen ervan... daarom probeer ik voordat ik begin met de bouw ook een goed beeld te krijgen van wat ik nou precies wil. Helaas blijkt in de praktijk steeds weer dat dit bijna nooit lukt

[Verwijderd]

tis vaak nuttig om de functionaliteiten van je programma te scheiden op
-hoe belangrijk is deze functie
-hoe vaak denk je dat ie gebruikt moet worden
-hoe snel moet de terugkoppeling zijn
-etc...

als je hier een mooi lijstje van hebt, dan kunnen je de belangrijkste en meest gebruikte(naar verwachting uiteraard) in een toolbar zetten en de rest in het menu stoppen. zo combineer je het 3klik principe met een duidelijke structuur

tip: het boek Effectief GUI-Ontwerp(ISBN 9039509034) is hier een mooie hulp in, tis erg taaie stof, maar zeker bruikbaar en zeer leerzaam

[mulder]

Ik maak vaak eerst een GUI, dan begin ik met coden. Zo min mogenlijk buttons e.d., daar raakt de gebruiker alleen maar in de war van. Stark en simpel, dan wijst het zich vanzelf.

[MisterData]

Ow jah, ook nog een goede tip : Gebruik alle ruimte die je beschikbaar hebt !!

Neem nou bijvoorbeeld HomeNet van ABN AMRO. Dat programma is ontzettend knullig. Je kan dat schermpje totaal NIET maximaliseren, en dat is (zeker bij grote lijsten met transacties) wel eens handig. En inderdaad, KISS is wel een goed motto om mee te werken

[stylee]

Onmisbare link alert

http://www.joelonsoftware.com/

[SilentSimon]

Ik vind die werkbalken van Adobe of Macromedia in flash altijd wel erg makkelijk
lekker klein en overzichtelijk en op elke manier aan te passen e.d.

[MisterData]

Jah klopt, ik vind het ook altijd erg fijn als ik de GUI van een bepaalde applicatie helemaal naar mijn wensen kan aanpassen. Dus zelf de icoontjes op de werkbalk kunnen kiezen env an die zelfaanpassende menuus zoals in Office.
Maar maak het niet te ingewikkeld

[dusty]

Ligt eraan hoe de klant het wilt hebben.

De klant wilt alle knopjes pimpelpaars, krijgt de klant ze in pimpelpaars. Tenslotte moet die ermee werken.

[MisterData]

Tsja, als ik zoiets zou maken emt pimpelpaarse knoppies dan zou ik op z'n minst die kleuren uit het windows registry gebruiken, dus de kleuren van windows

[Crazy D]

Op woensdag 28 november 2001 15:54 schreef stylee het volgende:
dit: hoe gaan jullie btw om met puur het ontwerpen van een GUI, word er eerst een schetje op papier oid gemaakt voordat jullie daadwerkelijk aan de bouw beginnen? Ikzelf vind het veranderen van een GUI behoorlijk lastig in vergelijking met het van de grond af opbouwen ervan... daarom probeer ik voordat ik begin met de bouw ook een goed beeld te krijgen van wat ik nou precies wil. Helaas blijkt in de praktijk steeds weer dat dit bijna nooit lukt

Schetsen? Op papier bedoel je? Dat heb ik nog nooit gedaan

Naja zoals ik al zei, ik maak grotendeels maatwerk versies van bestaande dingen, en dan kom je al snel uit op iets wat daar wel op lijkt, alleen vereenvoudigt hier en daar. Voor nieuwe dingen begin ik meestal met code kloppen, en zorgen dat hetgeen wat het moet doen in code werkt, en daarna ga ik wat schuiven met controls net zolang tot ik het lekker makkelijk vind werken. Of, als er bij de besprekingen met de klant al dingen naar voren zijn gekomen over de layout, baseer ik me uiteraard daarop. Ik ga niet eerst een volledige gui schetsen en zo, daar gaat veel te veel tijd in zitten en dan zijn we juist het voordeel wat wij bieden voor klanten (snel, goedkoop, en geen probleem als er een aanpassing moet komen) weer kwijt. Maar ja zoals ik al zei, het soort programma's wat ik schrijf zijn grotendeels een stukje settings die meestal eenmalig ingeklopt worden, en daarna alleen maar een 'start' button om de daadwerkelijke aktie te laten uitvoeren. Ik denk dat als we iets zouden maken wat wat groter en uitgebreider is, we wel wat meer zullen schetsen en dat overleggen en nog eens een keertje extra goed over nadenken.
En ik kan behoorlijk goed visualiseren (zowel html-gui als 'echte' gui's) dus ik heb al vrij snel in m'n hoofd hoe het moet worden (alleen gaat de communicatie tussen mijn hoofd en m'n handen weleens met behoorlijk wat lag )