Qdobe 1
00 Allgemeines
Daten Adobe Wissensdatenbank „Qdobe.de“ Interfacedesign Daniel Ast Studiengang Grafik- Design V Semester 2014 DIPLOMA Private Hochschulgesellschaft Dozent: David Sickinger
Selbstständigkeitserklärung Ich erkläre hiermit, dass ich die vorliegende Arbeit selbstständig und ohne Benutzung anderer als der angegebenen Hilfsmittel angefertigt habe; die aus fremden Quellen (einschließlich elektronischer Quellen und dem Internet) direkt oder indirekt übernommenen Gedanken sind ausnahmslos als solche kenntlich gemacht. Die Arbeit wurde bisher weder im Inland noch im Ausland in gleicher oder ähnlicher Form einer anderen Prüfungsstelle vorgelegt und auch noch nicht physisch oder elektronisch veröffentlicht.
Hammelburg, 07.04.2014 Ort, Datum Unterschrift
03
01 Konzeption
Konzept Die Idee ist es eine digitale Wissenssammlung für alle Adobeprodukte in Form einer Webseite mit digitalem Punktesystem zu erstellen. Der Benutzer hat die Möglichkeit Informationen aus der Datenbank zu entnehmen oder auf Fragen, die ein anderer Benutzer gestellt hat, zu antworten. . Nachdem er die korrekte bzw. zweckmäßigste Antwort erhalten hat kann er die Frage als beantwortet bestätigen und der Informationsgeber erhält die digitale Punkte auf sein Konto gutgeschrieben. Somit ist gewährleistet das sich der Content ständig selber erweitert und immer mehr Informationsnehmer das Angebot nutzen. Redaktionell muss besonders auf Betrugsversuche (wie Informationsnehmer- u. Geber die selbe Person ist) achten. Gegebenenfalls muss der erzeugte Content aufbereitet werden. Das Fachwissen kann man Anhand der erworbenen Punkte sowie an der Durchschnittsbewertung anderer Benutzer zeigen. Des weiteren gibt es Gewinnspiele und Auszeichnungen für erreichte Punktgrenzen.
04
Interview Was genau macht die Redaktion? Aufbereiten des Usercontens und Useradministration. Wird ein User/innenprofil erstellt? Ja, es wird ein Userprofil geben. Bei der Neuanmeldung eines Users/in: Welche Daten werden abgefragt? Nickname, Vorname, Passwort, Biografie, Captcha Wie kann das User/innenprofil bearbeitet werden? Nach dem Login über das Metamenü. Was sieht ein User/in nach dem Login? Nach dem Login werden alle Antworten und das Metamenü eingeblendet. In welcher Form können User/innen interagieren? Die User/Innen können über ein internes Nachrichtensystem kommunizieren sowie über die eingestellten Posts.
05
Wie werden neue Inhalte durch den Einsteller (den User, die Userin) der Sammlung zugeordnet? Über das Suchformular, Kategorien, und durch Stöbern. Wie werden neu eingestellte Inhalte darüber hinaus vernetzt/ verknüpft? Nur auf der Indexseite oder durch das Suchformular (Neuste anzeigen). Wie ist das User/innenerlebnis des nicht angemeldeten Nutzers? Was bekommen die zu sehen? Sie sehen im Grunde das gleiche wie ein angemeldeter User. Der einzige Unterschied ist, dass der nicht angemeldete User/In die beste Antwort (Lösung) nicht einsehen kann.
01 Konzeption
Namensfindung
Questions + Adobe = Qdobe
Qdobe 06
Domain Das Projekt ist vorerst nur f端r den deutschsprachigen Raum vorgesehen.
www.qdobe.de
07
02 eRsCHeinUngsBilD
Bildmarke
08
Bild- Wortmarke
Qdobe
Myriad Pro Regular Qdobe
09
01 Konzeption
Sitemap
Home
Contact
About
extern FAQ
Login
Registration
Show
Show
Show
Show
Show
New
New
New
New
New
Edit
Edit
Edit
Edit
Edit
Gast registrierter Benutzer
Administrator 10
Die Sitemap stellt die Seitenstruktur von Qdobe dar. Alle Befugnisse die der Gast hat, hat ebenfalls der registrierte Benutzer zudem aber noch die Blau markierten. Alle Rot gekennzeichneten Bereiche kรถnnen nur von einem Administrator bedient werden.
Logout
Searchform
Searchword
Coins
Question
intern FAQ
Show
Show
Newest
Buy
New
New
Answered
Sell
Edit
Edit
Category
Userdata
Delete
Popluar
Show
Tags
New
Show
Edit
New
Delete
Edit
List (search results)
11
Userprofil
Answers
Delete
Admin
Statistics
02 eRsCHeinUngsBilD
12
Landingpage Mit dem aufrufen von www.qdobe.de gelang der Benutzer zuerst auf die Landingpage. Diese Seite ermöglicht eine sofortige Suche ohne den kompletten Inhalt der Hauptseite zu laden. Somit kann eine kurze Ladezeit gewährleistet werden und der Schwerpunkt liegt auf dem Ajax Suchfeld und die damit verbundene Abfrage in der MySQL Datenbank. Eine Autokorrektur sowie eine Autovervollständigung ist ebenfalls Bestandteil der Suchmaske. Nach Bestätigung der Sucheingabe gelangt der Benutzer auf die Startseite.
13
02 eRsCHeinUngsBilD
6 1
2 3
4
5
14
Landingpage
15
1
Logo ohne Schriftzug mit Link zur Startseite
2
Ajax Suchfeld
3
Submit Formbutton
4
Quicklinks in die Kategorien
5
Link zu FAQ- Seite
6
Metanavigation mit Login und Registrations- Link
02 eRsCHeinUngsBilD
16
Startseite Nach der Eingabe eines Suchbegriffs oder durch das klicken auf das Logo oder eine Kategorie gelangt der Benutzer auf die Startseite. Der Benutzer muss nicht eingeloggt sein um diese aufrufen zu können. Auf der Startseite hat der Benutzer die Möglichkeit eine Frage einzutragen, eine Suche durchzuführen oder bereits gestellte Fragen anzusehen oder zu beantworten. Des Weiteren bekommt der Benutzer Kurzinformation und Statistiken zu anderen Benutzern und generelle Informationen zur Datenbank. Es wurde ganz bewusst auf eine Mainnavigation verzichtet da im Grunde diese Seite nicht mehr verlassen wird. Es werden ausschließlich Abfragen und Eintragungen über Ajax Modal PopUps gesteuert.
17
03 BenUtzeRFÜHRUng
5
1
6
2
7 3 8
9
10
11
4
12
18
Startseite
19
1
Logo mit Schriftzug mit Link zur Startseite
2
Form zum eintragen einer Frage mit PopUp bei Bestätigung
3
Neu eingestellte Fragen mit Zusatzinformationen
4
Button um weitere Sieben Fragen anzuzeigen
5
Metanavigation mit Login und Registrations- Link
6
Ajax Suchfeld mit Link zum öffnen der erweiterten Suche
7
Anzahl der bis dato beantworteten Fragen
8
Neuste unbeantwortete Fragen
9
Benutzer mit den meisten Punkten für beantwortete Fragen
10
Meist gesuchte/ benutzte Schlüsselwörter
11
Archiv mit Verlinkungen alphabetisch oder nach Kategorien
12
Footer mit Social- Media Verlinkung sowie AGB- Nutzungsbedingungen etc.
03 BenUtzeRFÜHRUng
20
Login Der Login kann von der Landingpage oder der Startseite durchgef체hrt werden. Das Konzept des Modual PopUp wird auch beim Login durchgesetzt. Die aktuelle Hintergrundseite wird zu 90% ausgeschw채rzt und es erscheint ein PopUp mit der Aufforderung Benutzername und Passwort einzugeben. Des Weiteren stehen die Optionen zum wiederherstellen des Passwort und zur Registrations eines neuen Accounts zur Verf체gung.
21
03 BenUtzeRFÜHRUng
1
22
Startseite - Benutzer eingeloggt Nach dem Login kann der Benutzer auf sein Profil zugreifen und sich wieder ausloggen.
1
23
Darstellung der Metanavigation nach dem Login mit Nachrichtensymbol f端r neue private Nachrichten oder Newsletter.
03 BenUtzeRFÜHRUng
24
Account erstellen Die Option „Account erstellen“ öffnen ein PopUp bei dem man Benutzername, Passwort und Wiederholung, email- Adresse, informationen über den Benutzer, sicherheitsabfrage und sowie die Bestätigung der AgB und nutzungsbestimmungen eingeben muss. Die Prüfung der einzelnen Felder werden über Ajax gesteuert und werden somit sofort nach der eingabe bestätigt oder mit Hilfe eines Hinweistextes korrigiert.
Beispiel für Hinweistext
25
03 BenUtzeRFÜHRUng
1
26
erweiterte suche mit der erweiterten suche kann der Benutzer die suche nach Fragen weiter einschränken. sobald der User die erweiterte suche öffnet, fährt der subContent nach unten und die Auswahlmöglichkeiten werden angezeigt. gleichzeitig wird das „Frage eintragen“ Feld ausgeblendet und durch sortieroptionen ersetzt.
1
sortieroptionen
2
suchbegriff
3
suche nach Benutzernamen
4
suche nach zeitraum
5
suche nach Kategorie (Programm)
4
6
suche Version
5
7
suche nach offenen/ geschlossenen Fragen
6
8
submit- Button
7
2
3
8
Beispiel für Hinweistext
27
03 BenUtzeRFÜHRUng
1 2 3 4
5 6
7 8
28
Frage eintragen Das eintragen einer Frage soll ebenfalls intuitiv durch das formulieren der Frage auf der Startseite (siehe Seite ...) und auf dessen Bestätigung öffnet sich ein PopUp mit den erforderlichen Zusatzinformationen.
29
1
übergebene Frage von der Startseite
2
Auswahl der Kategorie (Mehrfachauswahl möglich)
3
Auswahl Version (Mehrfachauswahl möglich)
4
Detaillierte Informationen zur Fragestellung
5
Hinzufügen von Schlagwörtern für eine präzisere Suche
6
Hinzufügen von Projektdateien, Screenshots und/ oder Videos
7
Sicherheitsabfrage um Spam zu verhindern
8
Submit- Button
03 BenUtzeRFÜHRUng
1
2
3
4 5
30
Frage beantworten zum beantworten einer Frage klickt der Benutzer auf die Überschrift und es öffnet sich ein PopUp mit den Details zur Frage. Danach stehen die Antworten in der Reihenfolge, hilfreichste (am besten bewertete) zuerst. nach den Antworten gliedert sich das Antwort- Formular mit der Option medien hochzuladen an. Der Frageersteller kann über die sterne die beste bzw. hilfreichste Antwort bewerten und die Frage schließen. Der Benutzer mit der besten Antwort bekommt dann eine bestimmte Anzahl an Punkten gutgeschrieben und die Frage wird archiviert.
31
1
Frage mit Details
2
Antworten mit Bewertungen
3
Antwort- Formular mit media- Upload
4
sicherheitsabfrage
5
submit- Button
Bewertungssystem
03 BenUtzeRFÜHRUng
32
Benutzerprofil Wie in der Gesamtkonzeption wird auch das Benutzerprofil in einem PopUp geöffnet. Im Benutzerprofil sind statistische Informationen und Listenoptionen für bereits verfasste Texte als Link vorhanden. Ein internes Nachrichtensystem ermöglicht das senden von privaten Nachrichten. Ist der Benutzer eingeloggt kann er über das kleine Zahnrad (rechts- oben) das Benutzerbild seine Email und sein Passwort ändern, weitere Optionen sind nicht vorgesehen.
33
0⁴ ADministRAtiOn
1
2
4
34 3
Administration Die Oberfläche des Backends erstreckt sich gegenüber des Frontend über die komplette Bildschirmbreite. Das Backend verfügt über den bereits bekannten Header, einer Menüleiste links einem Contentbereich für die Fragen und Antworten Benutzerbearbeitung und einem Statistikbereich mit Infografiken.
35
1
Header mit Nachrichtensystem, Link zum Frontend und Logout
2
Menü mit Links zu den administratorischen Optionen
3
Contentbereich, dieser Bereich ist variabel und ändert sich je nach Option
4
Statistikbereich mit Informationen über die Webseite (SEO)
05 Fazit
Fazit Die Bearbeitung der einzelnen Themengebiete hat mein vorhandenes Wissen noch weiter vertieft. Ich habe neue Arbeitsweisen gewonnen und durch die Umsetzung ausschließlich im Reinzeichnungsschritt und nicht in der Umsetzung im Template bzw. in HTML konnte ich viele überflüssige Elemente ausblenden und mich auf das Wesentliche konzentrieren. Mit insgesamt circa Einhundert Arbeitsstunden war es in diesem Studiengang eine ein Projekt mit mittlerem Workload. Dies führe ich aber auf meine vorhandenen Kenntnisse in den Programmen zurück. Ansonsten hätte die Bearbeitung unvermeidlich länger gedauert.
36
38