Dokumentation Projektarbeit @-Kaufmann - BWZ Rapperswil-Jona
Dokumentation Projektarbeit @-Kaufmann - BWZ Rapperswil-Jona
Dokumentation Projektarbeit @-Kaufmann - BWZ Rapperswil-Jona
Erfolgreiche ePaper selbst erstellen
Machen Sie aus Ihren PDF Publikationen ein blätterbares Flipbook mit unserer einzigartigen Google optimierten e-Paper Software.
<strong>Dokumentation</strong> <strong>Projektarbeit</strong><br />
@-<strong>Kaufmann</strong><br />
Benjamin Kirch
<strong>Dokumentation</strong> <strong>Projektarbeit</strong> @-<strong>Kaufmann</strong><br />
the Psyconnection Syndicate<br />
Inhaltsverzeichnis<br />
Inhaltsverzeichnis 2<br />
Projektvorstellung 3<br />
Wozu diese Site...............................................................................................................................................3<br />
Die Idee dahinter............................................................................................................................................3<br />
Zielpublikum ..................................................................................................................................................3<br />
Personen im Hintergrund..............................................................................................................................3<br />
Teammitglieder 3<br />
Name: ..............................................................................................................................................................3<br />
Klasse: .............................................................................................................................................................3<br />
Arbeitgeber:....................................................................................................................................................3<br />
E-Mail: ............................................................................................................................................................3<br />
Pagedesign 4<br />
Seitenaufteilung..............................................................................................................................................4<br />
Schriftart.........................................................................................................................................................5<br />
Schriftgrösse ...................................................................................................................................................5<br />
Verwendete Farben........................................................................................................................................5<br />
Bilder...............................................................................................................................................................5<br />
Framedefinition..............................................................................................................................................5<br />
Seitenstruktur 6<br />
Anzahl Seiten ..................................................................................................................................................6<br />
Navigation.......................................................................................................................................................6<br />
Metatags..........................................................................................................................................................6<br />
Sitemap............................................................................................................................................................7<br />
Software ..........................................................................................................................................................8<br />
Hardware ........................................................................................................................................................8<br />
Hosting 8<br />
Verzeichnisstruktur Verzeichniserklärung..........................................................................................8<br />
Accounts..........................................................................................................................................................9<br />
Review 9<br />
Gute Dinge ......................................................................................................................................................9<br />
Schlechte Dinge ..............................................................................................................................................9<br />
Zukünftige Änderungen ..............................................................................................................................10<br />
Diverses 10<br />
Wie wird die Seite weiter Bearbeitet ..........................................................................................................10<br />
Ben Kirch Seite 2 von 10
<strong>Dokumentation</strong> <strong>Projektarbeit</strong> @-<strong>Kaufmann</strong><br />
the Psyconnection Syndicate<br />
Projektvorstellung<br />
Wozu diese Site<br />
Das Ziel dieser Site ist es, Informationen zu den Spielen des Psyconnection Syndicate zu<br />
geben, den Mitgliedern eine gemeinsame Newsplattform zu bieten und den PsySyn Clan<br />
im Web vorzustellen.<br />
Später sollen Patches und Mods für diverse Spiele angeboten werden, um den Mitgliedern<br />
des PsySyn Clans die Suche derselbigen zu ersparen.<br />
Die Idee dahinter<br />
Die Idee entstand eigentlich gleichzeitig mit der Gründung des PsySyn Clans in 1998,<br />
seither gab es schon 2 Seiten für den PsySyn Clan, jedoch waren diese sehr<br />
unprofessionell und eher ein Zeitvertreib für 1-2 Member als eine ernsthafte Seite. Der<br />
Betrieb der Bisherigen Sites wurde eingestellt, in 2003 wurde die Adresse<br />
www.psyconnection.ch gesichert, zusammen mit einem dazugehörigen Webspace<br />
Zielpublikum<br />
Die Zielgruppe dieser Site besteht überwiegend aus Gamern, die Patches oder Files für<br />
Games suchen, oder sich über den PsySyn Clan und dessen Mitglieder zu informieren. Ein<br />
anderer Teil der Besucher werden Freunde/ Bekannte der Clanmitglieder sein, die sich das<br />
Ganze mal anschauen wollen und sich vielleicht über die einzelnen Games informieren<br />
wollen.<br />
Personen im Hintergrund<br />
Dieses Projekt ist eine Einzelarbeit, von mir, {PsySyn}B.t.K. dem Webmaster des PsySyn<br />
Clans. Jedoch haben einzelne Mitglieder an den Usability-Tests teilgenommen, wodurch<br />
eine Optimierung der Navigation und des Aufbaus der Site möglich gemacht wurde.<br />
Während des Unterrichts am Mittwochnachmittag standen Markus auf der Maur und Pius<br />
Senn mir bei Fragen zur Seite und habe mir die notwendigen Arbeitsabläufe erklärt und<br />
gezeigt.<br />
Teammitglieder<br />
Name:<br />
Benjamin Kirch<br />
Klasse:<br />
KE3b<br />
Arbeitgeber: Weidmann Infra AG<br />
E-Mail: Ben@Kirch.ch (Privatadresse)<br />
lyriclova@hotmail.com (meistgenutzte Adresse)<br />
webmaster@psyconnection.ch (Betreffend der Homepage)<br />
Ben Kirch Seite 3 von 10
<strong>Dokumentation</strong> <strong>Projektarbeit</strong> @-<strong>Kaufmann</strong><br />
the Psyconnection Syndicate<br />
Pagedesign<br />
Seitenaufteilung<br />
Die Homepage existiert in 2 Versionen, einer Version für hoch-auflösende Bildschirme, und<br />
einer reduzierten Version für Bildschirme mit geringer Auflösung.<br />
Reduzierte Auflösung<br />
Logobereich<br />
Link-<br />
Bereich<br />
Inhalt<br />
Das Layout der reduzierten Auflösung ermöglicht dem Besucher mit kleinerem Bildschirm<br />
die Seite in angepasstem Format zu betrachten, Diese Variante besteht aus einem Logobar<br />
am oberen Bildschirmrand. Der Navigationsbereich befindet sich links, und beinhaltet die<br />
Links zu den Unterseiten sowie zum Impressum.<br />
Grosse Auflösung<br />
Logobereich<br />
Link-<br />
Bereich<br />
Inhalt<br />
News<br />
In dieser Version existiert auch ein Logobar oben am Seitenrand, die Links ebenfalls auf<br />
der linken Seite und (bei dieser Version speziell) ein Newsbereich, welcher aktuelle<br />
Screenshots sowie allfällige News enthält, die schnell einsehbar sein sollen…<br />
Ben Kirch Seite 4 von 10
<strong>Dokumentation</strong> <strong>Projektarbeit</strong> @-<strong>Kaufmann</strong><br />
the Psyconnection Syndicate<br />
Schriftart<br />
Auf der Site werden 2 verschiedene Schriftarten benutzt, einerseits Comic Sans MS für die<br />
Linkliste (mit Ausnahme des Impressum-Links, der ist bewusst in Arial geschrieben) und für<br />
den Rest der Site wurde Arial verwendet, da diese Schrift eine Gute Lesbarkeit bietet und<br />
auf allen Computern vorinstalliert ist.<br />
Schriftgrösse<br />
Ich habe keine Schriftgrösse festgelegt, also wird die Standartschriftgrösse von 12<br />
verwendet, das ermöglicht dem Besucher, Die Schriftgrösse durch scrollen zu verändern<br />
(ctrl + Scroll up/down)<br />
Verwendete Farben<br />
Auf der Seite herrschen Grün, Blau, Grau und Schwarz vor, die typischen Farben des<br />
PsySyn Clans. Dabei wurden Folgende Mischverhältnisse verwendet:<br />
Blau:<br />
Schwarz:<br />
Grau:<br />
Grün:<br />
#0000CC (Links)<br />
#000000 (Hintergrund, Schrift)<br />
#D8D8D8 in Abwechslung mit #DBDBDB (Hintergrund)<br />
#7CB044 (Gästebuch)<br />
Bilder<br />
Die Bilder die auf der Seite zu sehen sind wurden von mir, resp. den Clanmitgliedern selbst<br />
gemacht, daher musste ich keine Verwendungserlaubnis von Drittpersonen einholen.<br />
Framedefinition<br />
Die Frames die ich verwendet habe können vom Besucher nicht in der Grösse verändert<br />
werden (noresize). Um die Frames auch bei unterschiedlicher Fenstergrösse gut<br />
anzuzeigen haben der Logoframe, der Naviframe und der Newsframe eine fixe Grösse und<br />
es werden bei Unterschreitung der Mindestgrösse keine Scrollbars eingeblendet.<br />
Dabei sind die Grössen wie folgt:<br />
Logoframe: 86pixel x Gesamtbreite<br />
Link/Newsframe: 140pixel x Gesamthöhe<br />
Der Inhaltsframe nimmt den verbleibenden Platz in Anspruch<br />
Der Link- und der Naviframe sind (abgesehen vom Inhalt) identisch, also in Hintergrundbild<br />
und Grösse gleich. Als Hintergrund wurde das Bild green.jpg definiert.<br />
Der Logoframe (oder auch Topframe genannt) hat nur das Logo des PsySyn Clans als Inhalt, und<br />
einen Schwarzen Hintergrund<br />
Ben Kirch Seite 5 von 10
<strong>Dokumentation</strong> <strong>Projektarbeit</strong> @-<strong>Kaufmann</strong><br />
the Psyconnection Syndicate<br />
Tabellen<br />
Auf der Site wurden verschiedene Tabellen benutzt, und zwar bei folgenden Seiten:<br />
Index.htm (die Sprachauswahl/Begrüssungsseite)<br />
Index_pics.htm (die Auswahlseite für die Bildergallerien) sowie dessen Folgeseiten<br />
Index_members.htm (die Auswahlseite der Memberprofile) sowie dessen Folgeseiten<br />
Index_games.htm (die Auswahlseite der Games) sowie dessen Folgeseiten<br />
index_downloads.htm (die Auswahlseite der Download-bereiche sowie dessen Folgeseiten<br />
squads.htm (die Auflistung der Squads)<br />
sowie auf allen Screenshot-Seiten<br />
Bei den meisten Tabellen (mit Ausnahme derjenigen im Download und Memberbereich)<br />
wurde auf die Sichtbarkeit verzichtet, da es in erster Linie um die Gliederung, und nicht um<br />
die Unterteilung der einzelnen Zellen geht.<br />
Seitenstruktur<br />
Anzahl Seiten<br />
Die gesamte Site besteht momentan aus 83 Seiten wobei davon nur 78 verlinkt sind, die<br />
restlichen sind Vorlagen<br />
Navigation<br />
Die Navigation im Naviframe besteht aus 7 Textlinks, und leitet den Besucher auf den<br />
gewünschten Bereich der Site weiter.<br />
Metatags<br />
Ich habe auf jeder Seite der Site Metatags eingebettet. Um es möglichst simpel zu halten<br />
habe ich nur einen Tagsatz verwendet, den ich in alle Vorlagen und bereits existierenden<br />
Seiten eingebettet habe. Ich habe dabei folgende Keywords verwendet:<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
Ben Kirch Seite 6 von 10
<strong>Dokumentation</strong> <strong>Projektarbeit</strong> @-<strong>Kaufmann</strong><br />
the Psyconnection Syndicate<br />
Wichtig dabei sind vor allem der “Revisit“-Tag, der den Zeitabstand bis zum zweiten<br />
Besuch definiert, der “Robot“-tag, der verhindert, das die Unterseiten indiziert werden,<br />
sowie der “Keywords“-tag, der die Schlüsselwörter steuert.<br />
“Page-topic“ lässt den Besucher erkennen Was er auf dieser Seite findet. Wobei die<br />
“description“ den in Suchmaschinen angezeigten Text beinhaltet<br />
Sitemap<br />
Einstiegspunkt stellt die Seite index.htm dar.<br />
Dort kann der Besucher sich eine Auflösung aussuchen.<br />
(In naher Zukunft wir der Benutzer auch die Sprache wählen können, aber das wird erst zu einem<br />
späteren Zeitpunkt realisiert.)<br />
Von dort aus gelangt man entweder nach index_small oder big, je nach dem, was für eine<br />
Auflösung man bevorzugt.<br />
Von dort aus kann man per Navigation auf die einzelnen Bereiche der Seite zugreifen.<br />
Ben Kirch Seite 7 von 10
<strong>Dokumentation</strong> <strong>Projektarbeit</strong> @-<strong>Kaufmann</strong><br />
the Psyconnection Syndicate<br />
Eingesetzte Techniken<br />
Software<br />
Ich habe hauptsächlich das von der Schule zur Verfügung gestellte Macromedia MX 2004<br />
verwendet, im speziellen Dreamweaver und Fireworks.<br />
Für die Screenshots wurden GameCam und die Spiele selbst verwendet.<br />
Hardware<br />
Die Fotos die als Basis für die Hintergründe und Logos dienten, sowie die Fotos der Games<br />
wurden mit einer Canon 300D gemacht. Zuhause & im Geschäft konnte ich meinen Laptop<br />
verwenden, Als leistungsstarker Rechner fürs Grobe stand mein Alienware S4-7500 zur<br />
Verfügung.<br />
Hosting<br />
Verzeichnisstruktur<br />
Verzeichniserklärung<br />
Teilbereiche<br />
Die Site besteht aus den Teilbereichen<br />
Downloads, Games, Members und Pics<br />
Innerhalb der Teilbereiche findet man die<br />
einzelnen Seiten sowie eine Vorlage<br />
Die Bilder der Seiten wurden in dem Images-<br />
Ordner abgelegt, so können sie für beide Teile<br />
der Page verwendet werden<br />
Sprachbereich<br />
Die Struktur wurde vorbereitet, um die Site<br />
später ins Englische zu übersetzen<br />
Ben Kirch Seite 8 von 10
<strong>Dokumentation</strong> <strong>Projektarbeit</strong> @-<strong>Kaufmann</strong><br />
the Psyconnection Syndicate<br />
Accounts<br />
Webspace1<br />
FTP:<br />
Adresse:<br />
Passwort:<br />
Webspace2<br />
FTP:<br />
Adresse:<br />
Passwort:<br />
Gästebuch<br />
Anbieter:<br />
Adresse:<br />
Login:<br />
Passwort:<br />
www.bwzrapperswil.ch<br />
www.bwzrapperswil.ch/2006/clan/<br />
ist in den Unterlagen hinterlegt<br />
ftp.psyconnection.ch<br />
www.Psyconnection.ch<br />
kann per Mail an {PsySyn}B.t.K angefordert werden<br />
http://www.gratis-gaestebuch.ch/<br />
http://www.gratis-gaestebuch.ch/gbook.php4?login=psysyn<br />
psysyn<br />
kann per Mail an {PsySyn}B.t.K angefordert werden<br />
Review<br />
Gute Dinge<br />
Der Rahmen für die Page war sehr breit ausgelegt, was mit beim Aufbau der Site viel<br />
Spielraum liess. Ich habe im Lehrbetrieb viel Zeit bekommen um an der Page zu arbeiten,<br />
was mir vor allem in der Schlussphase sehr viel gebracht hat.<br />
Es war interessant Macromedia und dessen Produkte genauer kennen zu lernen, die<br />
einzelnen Programme waren auch bei der anfänglichen Planung ein wichtiger Faktor. So<br />
konnte ich mit Fireworks einen Grafischen Rohbau der Seite entwickeln, ohne tatsächlich<br />
schon eine Homepage erstellen zu müssen…<br />
Da ich im Bereich HTML und Homepagebau schon viele Grundkenntnisse hatte, hatte ich<br />
keinerlei Probleme, den Ausführungen der Experten zu folgen.<br />
Schlechte Dinge<br />
Einzelne Member haben nur unzureichend Daten über sich, sowie Photos zur Verfügung<br />
gestellt, und so konnten auch nicht alle Member aufgeführt werden.<br />
Da ich grafisch nicht sonderlich begabt bin, habe ich mehrere Monate an dem Design<br />
rumgedoktert, was schlussendlich in einem Zeitengpass endete, der mir gegen Ablauf der<br />
Frist ein paar schlaflose Nächte bereitet hat.<br />
Das Thema Zeitmanagement wurde erst gegen Ende des Kurses thematisiert, ich hätte es<br />
als sinnvoller empfunden, das noch vor dem eigentlichen Bau der Homepage zu lernen.<br />
Ben Kirch Seite 9 von 10
<strong>Dokumentation</strong> <strong>Projektarbeit</strong> @-<strong>Kaufmann</strong><br />
the Psyconnection Syndicate<br />
Zukünftige Änderungen<br />
Das Design ist einer der Punkte, der in näherer Zeit nochmals überarbeitet wird.<br />
Die Page wird auf den Webspace des PsySyn Clans umgesiedelt, damit sie unter<br />
www.psyconnection.ch erreichbar ist. Einzelne Aufgabenbereiche des Webdesigns werden<br />
an Drittpersonen abgegeben.<br />
Die Seite soll später in 2 Sprachen (Deutsch/Englisch) zur Verfügung stehen, daher wird<br />
die gesamte Seite so wie sie momentan existiert ins Englische übersetzt. Nach und nach<br />
entsteht so dann ein englisches Abbild von dem deutschen Bereich.<br />
Die Bilder sind zentral abgelegt, so müssen diese nicht erneut kopiert werden.<br />
Diverses<br />
Wie wird die Seite weiter Bearbeitet<br />
Falls später jemand die Seite revidieren oder Updaten möchte kann er diese<br />
<strong>Dokumentation</strong> zur Rate ziehen, sie ist ebenfalls als .pdf auf dem Server hinterlegt.<br />
Ben Kirch Seite 10 von 10
Change language