Website düsterer bzw. "böser" gestalten

wopwop

Grünschnabel
Hi, ich hoffe ich poste das jetzt im richtigen Bereich, ansonsten bitte verschieben liebe Moderatoren :)

Es geht um folgendes: Ich betreibe ein kleines Browsergame, das Design steht soweit auch, jedoch ist es viel zu brav/kindgerecht geworden. Ich würde das Spiel gern etwas düsterer anlegen. Dafür brauche ich Tipps, was ich verändern muss.

Allen voran denke ich das das Logo verändert werden müsste, und auch das Hintergrundbild. Eventuell mit tropfendem Blut, o.Ä.

Irgendwie bin ich mit meinen Grafik-Kentnissen auch nicht viel weiter gekommen, als der jetztige Stand (und das hat schon sehr lange gedauert bis es halbwegs zusammengepasst hat).

URL zur Hauptseite: www.phantom-battle.de

das background-image tagsüber:
http://www.phantom-battle.de/pb/Bilder/backgrounds/outside_background2.jpg
nachts:
http://www.phantom-battle.de/pb/Bilder/backgrounds/outside_background.jpg

das jetztige Logo ist folgendes:
logo_beta2.png


Ich finde im Zusammenwirken ist die Seite einfach viel zu kindgerecht, das wird dem eigentlichen Sinn des Spiels nicht gerecht. Eventuell sind auch die Buttons, die ich erstellt habe mit Schuld?

Wär nett, wenn mir jemand Tipps geben könnte, was ich verändern muss, um dem Spiel einen düstereren Touch zu geben ;)

Vielen Dank im Voraus,
Robert
 
Hi
Erstmal vorweg: Ich bin absolut kein Profi was diese Sache angeht habe aber grosse Spielerfahrung :D
Alles was ich hier schreibe ist nicht böse gemeint sondern soll als hilfe dienen (darf also auch ignoriert werden ^^)

Abgesehen davon weiss ich auch wie schwer es ist etwas zu gestalten, da ich mich auch schon an das Thema herangewagt habe.

Nun zur Kritik:

Ich habe deine Website angeschaut und folgendes festgestellt(bei Nacht):
Der graue Rand den ich auf meinem 16:9 Bildschirm habe ist definitiv zu hell und passt deshalb nicht (Bild bis zum rand, Übergang usw..? Das ganze hat schlicht und einfach zu viel Licht! Pechschwarz bitte =D

Das Logo mit der orangenen Farbe bringt noch einmal licht und der Geist sieht zu freundlich/Hilflos aus! Besseres Beispiel: http://www.google.ch/imgres?imgurl=...page=1&ndsp=38&ved=1t:429,r:3,s:0&tx=51&ty=64
Gleiches gilt für den Pfeil. Des Weiteren scheinenä mir die Häuser zu hoch, das Dach zu wenig flach und die Kanten zu gerade. (wenn ich mit Horrorfilmen vergleiche )

Der Horizont ist für meinen geschmak zu weit forne, die Grabsteine zu klar auf einer Linie. Und auch hier wieder: zu gerade Kanten (aus meiner Sicht ^^)

Positiv aufgefallen dagegen ist mir die Katze mit den leuchtenden Augen!

Die weisse Schrift verharmlost das ganze noch einmal (versuchs doch mal mit nem Giftgrün oder einem dunklen, satten Rot.

Die buttons sind zu hell geraten und (wie hätte es auch ander sein können :D) Die kanten zu gerade.
(evt. kannst du bei den buttons den passenden Ausschnitt des Hintergrundbildes einfügen und dann die kannte verwittert gestalten...?)

Selbst die Schrift ICH WILL MITSPUKEN erinnert mit Rot-Weiss eher an ein Candy-shop Werbeplakat.

Auch das grüne "Kostenlos und werbefrei" passt nicht wirklich.
Wenn du Erfahrung in Webprogrammierung hast könntest du vielleicht sogar von zeit zu zeit einen Blitz zucken lassen oder die Katze mit den Augen Funkeln lassen.

So das wars^^ ich hoffe meine harte Kritik hat dir weitergeholfen und ich wünsche dir viel erfolg und dudurchhaltevermögen für die nächste Zeit.

Gruss Bambam
 
Hallo, vielen Dank für deine Kritik!

Ich merk schon, da spielen viele Sachen zusammen, ich werd mal versuchen es nach und nach anzugehen.

Ehrlich gesagt die Idee mit dem schwarzen Hintergrund hatte ich auch schon, das werde ich als erstes probieren. Das die "Ich will mitspuken Schrift" nicht recht reinpasst, hab ich mir schon gedacht. Da wär wohl was mit tropfendem Blut angebracht (hab schon ein Tut gefunden dafür).

Das Backgroundimage hab ich als einziges von der Seite nicht selbst erstellt, sondern aus OpenClipart, ich habe nur den Rand ausgefranst. Somit kann ich da die Sichtlinien nicht beeinflussen. Eventuell finde ich aber noch eine passendere Vorlage.

Das restliche Design hab ich aber komplett selbst verzapft :D

Deine Idee mit dem Aufblitzen hab ich auch schon gehabt, dazu hab ich bereits folgendes erstellt (noch nicht integriert):
http://www.phantom-battle.de/pb/Bilder/backgrounds/outside_katze.gif

Die Katze soll auf einen komplett schwarzen Teil des Hintergrundbildes gelegt werden, sie blitzt alle 20 sek kurz rot auf.

Hatte es schonmal kurz drin aber fand es dann doch nicht so passend, denn das Nachtbild hat ja bereits eine Katze.

Die Buttons muss ich mir nochmal vornehmen. Am Besten wärs aber, wenn ich da nur farblich was machen könnte, ist halt alles schon pixelgenau ins Design eingefügt...

Und mit der weißen Schrift in grün oder rot ist auch ne gute Idee, werd mal probieren wie gut man das noch lesen kann. Wills halt auch nicht zu bunt machen (ist es ja jetzt schon).

Vielen Dank soweit, werd mal sehen, was ich davon allein umsetzen kann, oder ob ich da doch mal Hilfe brauche. Bin leider auch nicht so der Grafik-Pro ;)

Achja @ BamBam: Welchen Pfeil meinst du?

Hat noch jemand Vorschläge? Das Phantom-Battle-Logo oben da hab ich auch vorhergehende Versionen ohne den gelben Rand, der Geist ist aber immer drin, eventuell kann man den irgendwie böser aussehen lassen?!

mit besten Grüßen,
Robert
 
Zuletzt bearbeitet:
Moin
Kritik hab ich ne Menge, aber bin beim Satz "Eventuell mit tropfendem Blut" schon hängengeblieben.
Dies nutz ich mal als kleinen Denkansatz und liefer dir keine Tips zu einzelnen Sachen.

Welche Zielgruppe hast du?
Wieso diese Bildsprache?
Warum so viele optische Effekte und Symbole?
usw usf

Du darfst gerne recherchieren und schauen wie es andere machen, analysieren warum es funktioniert oder eben nicht funktioniert.
Danach für dich selber überlegen, wie und was das Richtige für dein Spiel wäre.
Nun wählst du deine Bildsprache (ich weiß warum du die jetzigen "Bilder" verwendet hast, Asoziationsketten...).
Denk dran, weniger ist mehr. Auch die beste Horrorfilmmusik besteht aus 3 Akkorden.

Und zum Schluß frage dich ob du wirklich zusätzlich tropfendes Blut brauchst?!

Beste
 
Welche Zielgruppe hast du?

Jugendliche und Erwachsene

Wieso diese Bildsprache?

Ich arbeite viel mit den freien Grafiken aus OpenClipart, da diese an keinerlei Rechte geknüpft sind, und ich sie nach Belieben verändern kann. Clipart steht natürlich für einen comicartigen Grafikcharakter. Das meintest du doch mit Bildsprache, oder?

Warum so viele optische Effekte und Symbole?

Ich nehme deine Kritik natürlich an, aber andere Seiten schaffen es auch mit einem Füllhorn an grafischen Spielereien gut auszusehen. Ich glaube das wird von einem solchen Spiel auch erwartet, das alles blitzt und blinkt. Das Spiel soll sich schließlich selbst auch nicht zu ernst nehmen.

Ein gutes Beispiel:
http://de.ageofmagic.net/

Das sieht Klasse aus, und wahrt trotzdem den Comic-Look.

Das ist auch mein erstes größeres Projekt, bin noch auf der Suche nach dem richtigen Stil.
Zu der blutigen Schrift: Das war halt meine Idee um es düsterer zu machen. Du hast natürlich recht, das man nicht einfach verschiedene Ansätze durcheinander würfeln sollte. Es schein mir leichter einen Themenmix zu generieren. schwarzer Hintergrund = düster, blutige Schrift = Horrorfilm-Touch.

Vielen Dank für deine Kritik! ;-)
 
Hi, ich hab mich rangesetzt und einiges überarbeitet!

Die Änderungen:

- Schriften in giftgrün (#00EE00)
- Hintergrundfarbe schwarz (dafür musste ich das Tages- bzw. Nachthintergrundbild natürlich entsprechen überarbeiten
- main-Logo in grün gestaltet und einen Wassereffekt über das Phantom gelegt
- Buttons grün, Hovereffekte farblich abgeschächt (weniger satte Farben)
- Hovereffekt bei aktiven Button entfernt (zuviel sinnlose Spielerei)
- Die Schrift "Ich will mitspuken" grün eingefärbt und mit einem leichten Wassereffekt unterlegt

Ich finde die Seite wirkt jetzt stimmiger, vorallem weil nicht mehr soviel bunte Farben (Candybar) gemixt sind. Wie sehr ihr das?

Beste Grüße, wopwop
 
Der Amateur meldet sich mal wieder :
Auf mich wirkt die Sache jetzt definitiv besser =)
Zufrieden geben würde ich mich in deiner Position noch immer nicht.
Das grün erscheint schon besser. Allerdings würde ich eine dickere Schrift wählen, da das Grün im moment (zumindest für mich) nicht ausreichende Lesbarkeit besitzt.
Zudem wirkt das gesamtbild für meinen Geschmack immernoch zu hell.
Evt könntest du das gesamte Hintergrundbild abdunkeln...?

Dann wären da natürlich immernoch die unverwitterten Grabsteine, zuhohen Häuser usw^^
Aber für den Anfang sieht das doch ganz toll aus.

Kleine Bemerkung am Schluss: Da du den angeklickten Button nun grün hast würde ich die Orangene-Umramung beim drüberfahren wegnehmen. Das beisst sich irgendwie zu fest ;)

mfg
 
Hi, ich fänd es gut, wenn dus dir bei Tag nochmal ansehen würdest! Das andere Hintergrundbild geht jetzt besser ins schwarz über imo! Ist aber halt auch etwas sanfter vom Thema her!


EDIT:
Hab die Schrift mal etwas verändert, die Hovereffekte bei den Buttons angepasst (dezentes grün), das Nachtbild hab ich auch etwas bearbeitet (weniger Licht, mehr Kontrast).
 
Zuletzt bearbeitet:
Das soll jetzt nicht böse gemeint sein aber,
sorry bei der Seite bekomme ich Augenkrebs. Ich finde es zwar nett das du son Browsergame baust, aber vom Design lass lieber die Finger.

Wichtigeste Punkte:
- Diesen riesen runden Ecken sind häßlich
- Die Navi sieht grauenhaft aus
- Der Login ist einfach nur hingeklatscht
- Das Aussehen ist in sich nicht stimmig, passt nicht und sieht aus wie mit paint in 5 miuten gebaut

Schau dir mal paar moderne Seite an oder schau deviantart.com nach paar Ideen. Ich kann dir sagen das ich dein Browsergame niemals spielen würde weil ich jedesmal wenn die Seite aufgeht das grauen vor diesem unansehnlichen Design bekomme.

Vorschlag: da du das ja anscheinend langfristig betreiben möchtest und früher oder später wahrscheinlich auch bissel Geld mit der Seite verdienen, empfehle ich dir 50 - 100 € zu investieren und dir einen semiprofessionellen Designer an land ziehst. Der sollte dir dann eine ansehnliche Seite bauen bei der man nicht gleich wieder den Schließen Button betätigen will.
 
Zuletzt bearbeitet:
Zurück