Showroom - Aktuelle Arbeiten und Projekte

[marcgfx]

cool! hast du auch schon eine idee was du damit machen wirst?

[Schrompf]

Terminator-Apokalypse-Survival-Bastelspiel :-)

[marcgfx]

also zombies vernichten und mit den überresten segelflugzeuge bauen? hört sich genial an!

[Schrompf]

Nein, ich habe *so* die Nase voll von Zombies. "Terminator" lautet stattdessen das Stichwort - Roboter haben die Erde übernommen. Falls Du nicht "Connor" heißt, sehe ich schwarz für Deine Überlebenschancen...

Aber genug gewitzelt. Ich mache bei Gelegenheit noch einen Projektthread. Damit ich was verlinken kann, und damit ich auch in meiner Festanstellung-Papa-Zeit noch gelegentlich einen Tritt bekomme, daran weiterzumachen.

[Chromanoid]

Ich bin ja immer für Dämonen aus der Hölle oder meinetwegen auch Cthulhu-Viecher. :) Die sind Gameplay-technisch super praktisch (und vielseitig), da man denen irgendwelche magischen Spielregeln aufdrücken kann, ohne dass die Authentizität verloren geht. Feindfreie Gegenden? -> seit Äonen geweihter Boden, ein Schwur des Teufels etc. Bei Robotern und anderen nicht-okkulten Wesen muss man sich dann schon sowas wie schwere elektromagnetische Störungen aus den Fingern saugen... Bei Dämonen sind willkürliche Spielregeln sozusagen konzeptionell vorgesehen.

[marcgfx]

der nachteil von dämonen ist das alles organisch ist. organisch ist viel schwieriger gut zu machen als mechanisch. bei robotern beschwert man sich nicht so schnell über die unnatürlichen bewegungen. wenn die graphik von hand gezeichnet wird ist das wieder ne andere geschichte.

[Schrompf]

So, zumindest Sonnenschatten funktioniert jetzt. Und der VoxelSpace-Renderer schlägt sich erstaunlich gut, vor allem mit mehr Lichtquellen. Leider ist der Grafikstil hier keine Absicht, sondern ein Resultat völlig fehlzugeordneter Voxelmaterialen. Ich liebe diesen Anklang von Tundra-Stadtruine, aber ich fürchte, ich kriege das nicht reproduziert.

Nuja, Bild anbei. Shader sind noch mit SKIP_OPTIMIZATION kompiliert, sonst würde das noch einen Zacken schneller laufen.
[Edit] Hrhrhr... die Screenshot-Funktion kommt rum, bevor die Statistiken draufgerendert werden. Das Bild da enthält etwa 2 Millionen sichtbare Polygone und rendert mit 140fps.

[marcgfx]

sieht richtig geil aus. die fehlzuordnung ist zufällig, kannst du die nicht irgendwie speichern? finde auch das es verdammt gut passt :)

[Chromanoid]

Jau sehr sehr geil! Der Grafikstil strahlt totale Post-Apokalypse aus :) Tolle Farbwahl , auch wenn sie Zufall ist! Du solltest es auf jeden Fall irgendwie konservieren, damit Du das vielleicht doch reproduziert bekommst. Wie sollen die Spielfiguren aussehen? Ein bisschen wie in Borderlands vielleicht?

Wird das ganze ein FPS? Der Screenshot erinnert mich total an Jagged Alliance nur im Norden Russlands, so ein Spielprinzip würde sicher auch gut funktionieren.

Der rote Kreis mit schwarzem Loch irritiert mich, was ist das?

[Schrompf]

Danke! Ich freu mich auch gerade ziemlich, wie sich das entwickelt. Das Rote ist ein aufblasbares Planschbecken :-) Im Orginal war die Szene grün und gelb, sonnige amerikanische Kleinstadt. Da passte das Planschbecken noch.

[xq]

Ich bastel grade für Destoroya an einem generischen Physikmodell-Editor für ODE:

Der Editor ist im Moment noch kein Editor sondern eher ein Viewer/Tester, ich muss dem ganzen noch eine Editor-Struktur verpassen, mit der man auch ordentlich arbeiten kann. Der Panzer selbst grade kann gefahren werden, seinen Geschützturm drehen und das Rohr nach oben/unten ausrichten. Dafür habe ich 3 (5) Schieberegler, welche die Panzersteurung erlauben.

Wenn ich heute oder morgen noch die Motivation habe, werde ich mal versuchen, einen Manipulator-Arm mit Greifer zu bauen, angelehnt an das hier:

[marcgfx]

wie sah es denn mit der motivation aus? ich warte auf den greifarm :D

[xq]

Ja, die Freundin war die Woche da :D
Am Wochenende werd ich vielleicht mal zeit finden.

[xq]

Schon wieder neuer Kram! :P

Bastle mit meiner Freundin an einem Adventure a'la Submachine:

Die Engine ist annähernd fertig, es fehlen noch Itemkombination und noch eine kleinige Usability-Features, dann kann man damit schon mal Spiele bauen....

[marcgfx]

du bist ja ziemlich produktiv im moment :)
habt ihr euch schon ne story ausgedacht?

[xq]

Ja, aber das wird grade erst mal ein kleiner Test für die Production Line :P

Also wie geht man stilistisch vor?, wie setzt man die Engine um? Ich denke wir werden bei dem handgezeichneten Stil (also auf Papier und dann gescanned) bleiben, ich find das auch unkoloriert schon schick :)

Um mal ein wenig zu spoilern: Die Story soll an dem vorletzten Staffelfinale von Dr. Who angelehnt sein

[antisteo]

Ich teile hier einfach mal meine Sammlung an Raspberry Pi-Videos

[Max Gooroo]

Jetzt habe ich echt nochmal die Struktur neu modelliert, weil ich so ein model-noob bin, aber keine fleckige Stadt mehr haben wollte ...
vielleicht auch weil mir aus unerfindlichen Gründen langweilig war.

Aber Blut gibt es jetzt ein wenig, was ungemein wichtig ist :D

[xq]

Geil :D Nur ist mir das ein wenig zu viel Bloom und ein wenig zu wenig Blut :D
Du musst mal schauen, wie viel Aufwand es ist, ne richtige Ragdoll damit zu basteln, das sollte mit Unity relativ einfach gehen. Eventuell kann man auch nen Backface-Shader schreiben, welcher dir an den Rissstellen (die ja im Modell ein Loch wären) eine Fläche mit Gore hinzaubert :D

[Max Gooroo]

Immer diese Bloom Diskussion :D ...
Ich glaube ich mache einfach einen Michael Bay Haken und dann soll es jeder so machen, wie er will :P

Am Ende habe ich am Bloom aber gar nichts gemacht, sondern nur die Szene etwas heller gedreht, weil man auf Screenshots auf den üblichen Hellen Hintergründen immer eher wenig sieht.
Und ne richtige Ragdoll ist eigentlich ziemlich wenig Aufwand, ich habe nur noch keine eingebunden, weil Ich ja erst einmal die Stadt auf ein geeignetes Tileset bringen musste, was ne Schweinearbeit ist, wenn man es selbst machen muss :(

Naja ... erst ma gucken ... Ich denke ma Ragdoll oder Stadtdetail wird dann das nächste ... beides in etwa gleich wichtig.
Und das Blutgelumpe habe Ich ja sowieso auch wegen meinem "eigentlichen" Spiel gemacht, da Blut im Dungeon irgendwie noch fehlte.

[xq]

Hier mal ein kleiner Screenshot und ein bisschen Snippets zu meinem Kram vom langen Wochenende:

Deklaratives UI Framework mit Layouting Engine für C#, OpenTK:



Layout-Code:

Code: Alles auswählen

Widget
{
	Panel(VerticalAlignment=Center, HorizontalAlignment=Center, Margin=16)
	{
		Table(Rows=4, Columns=3, Margin=16, Padding=8)
		{
			Button(Table.Row=0, Table.Column=0) {
				Label(Text="1");
			}
			Button(Table.Row=0, Table.Column=1) {
				Label(Text="2");
			}
			Button(Table.Row=0, Table.Column=2) {
				Label(Text="3");
			}
			
			Button(Table.Row=1, Table.Column=0) {
				Label(Text="4");
			}
			Button(Table.Row=1, Table.Column=1) {
				Label(Text="5");
			}
			Button(Table.Row=1, Table.Column=2) {
				Label(Text="6");
			}
			
			Button(Table.Row=2, Table.Column=0) {
				Label(Text="7");
			}
			Button(Table.Row=2, Table.Column=1) {
				Label(Text="8");
			}
			Button(Table.Row=2, Table.Column=2) {
				Label(Text="9");
			}
			
			Button(Table.Row=3, Table.Column=0) {
				Label(Text="*");
			}
			Button(Table.Row=3, Table.Column=1) {
				Label(Text="0");
			}
			Button(Table.Row=3, Table.Column=2) {
				Label(Text="#");
			}
		}
	}
}

Interface-Skin-Code:

Code: Alles auswählen

Skin
{
	Button : Style(Width=48, Height=48, Padding="4;0;0;10") {
		Default : Texture(Source = "button-normal.png");
		Hovered : Texture(Source = "button-hovered.png");
		Active  : Texture(Source = "button-clicked.png");
	}
	Label : Style(Font="kenvector_future.ttf", FontSize=24, FontColor=Black);
	Panel : Style {
		Default : TextureBox(EdgeWidth = 10) {
			TopLeft      : Texture(Source = "panel.png", Rect = "0;0;10;10");
			TopRight     : Texture(Source = "panel.png", Rect = "90;0;10;10");
			BottomLeft   : Texture(Source = "panel.png", Rect = "0;90;10;10");
			BottomRight  : Texture(Source = "panel.png", Rect = "90;90;10;10");
			
			TopMiddle    : Texture(Source = "panel.png", Rect = "10;0;80;10");
			MiddleLeft   : Texture(Source = "panel.png", Rect = "0;10;10;80");
			MiddleRight  : Texture(Source = "panel.png", Rect = "90;10;10;80");
			BottomCenter : Texture(Source = "panel.png", Rect = "10;90;80;10");
			
			Center       : Texture(Source = "panel.png", Rect = "10;10;80;80");
		}
	}
}

[xq]

Kleiner Nachtrag zu obigem:

Habe mittlerweile Bindings vervollständigt, jetzt hat das das User Interface auch Interaktivität:


Die Attribute mit den eckigen Klammern sind Bindings, welche Werte aus einem ViewModel lesen oder auch zurückschreiben können.

Code: Alles auswählen

Widget
{
	Panel(VerticalAlignment=Center, HorizontalAlignment=Center, Margin=16)
	{
		DockPanel(Margin=16) {
			Panel(DockPanel.Dock=Top) {
				Label(HorizontalAlignment=Left, Text=[DisplayText], Margin=10);
			}
			Table(Rows=4, Columns=3, Padding=8)
			{
				Button(Table.Row=0, Table.Column=0, Click=[Input1]) {
					Label(Text="1");
				}
				Button(Table.Row=0, Table.Column=1, Click=[Input2]) {
					Label(Text="2");
				}
				Button(Table.Row=0, Table.Column=2, Click=[Input3]) {
					Label(Text="3");
				}
				...

Der Code-Behind für die gesamte UI-Logik sieht wie folgt aus:

Code: Alles auswählen

namespace Solid.UI.Demo
{
	using System;
	using System.ComponentModel;

	public sealed class GameViewModel 
	{
		private string displayText = "";

		public event PropertyChangedEventHandler PropertyChanged;

		public GameViewModel()
		{
			this.Input0 = new KeypadCommand(this, 0);
			this.Input1 = new KeypadCommand(this, 1);
			this.Input2 = new KeypadCommand(this, 2);
			this.Input3 = new KeypadCommand(this, 3);
			this.Input4 = new KeypadCommand(this, 4);
			this.Input5 = new KeypadCommand(this, 5);
			this.Input6 = new KeypadCommand(this, 6);
			this.Input7 = new KeypadCommand(this, 7);
			this.Input8 = new KeypadCommand(this, 8);
			this.Input9 = new KeypadCommand(this, 9);
		}

		private void InputNumber(int number)
		{
			Console.WriteLine("Input: {0}", number);
			this.DisplayText += number.ToString();
		}

		public string DisplayText
		{
			get { return this.displayText; }
			private set
			{
				this.displayText = value;
				this.PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(nameof(DisplayText)));
			}
		}

		public Command Input0 { get; private set; }
		public Command Input1 { get; private set; }
		public Command Input2 { get; private set; }
		public Command Input3 { get; private set; }
		public Command Input4 { get; private set; }
		public Command Input5 { get; private set; }
		public Command Input6 { get; private set; }
		public Command Input7 { get; private set; }
		public Command Input8 { get; private set; }
		public Command Input9 { get; private set; }

		private class KeypadCommand : Command
		{
			private readonly GameViewModel vm;
			private int value;

			public KeypadCommand(GameViewModel gameViewModel, int value)
			{
				this.vm = gameViewModel;
				this.value = value;
			}

			public override void Execute() => this.vm.InputNumber(this.value);
		}
	}
}

Zudem habe ich ein Image-Widget implementiert:

Code: Alles auswählen

Button(Table.Row=3, Table.Column=2) {
	Image(Source = "green_checkmark.png");
}

Das Widget zeichnet im Moment ein Bild auf der vollen Größe des Widgets und wendet (noch) keine sinnvolle Skalierung an. Dafür ist der Code für einen neuen Widget-Typ durchaus kurz:

Code: Alles auswählen

namespace Solid.UI
{
	using Solid.Layout;

	public class Image : UIWidget
	{
		public static readonly SolidProperty SourceProperty = SolidProperty.Register<Image, Texture>(nameof(Source));

		public override Size SizeHint =>  this.Source?.Size ?? base.SizeHint;

		private TextureBrush brush = new TextureBrush();

		protected override void OnDrawPreChildren()
		{
			base.OnDrawPreChildren();

			var rect = GetClientRectangle();
			if(this.Source != null)
			{
				this.brush.Texture = this.Source;
				this.UserInterface.RenderBrush(this.brush, rect);
			}
		}

		public Texture Source
		{
			get { return Get<Texture>(SourceProperty); }
			set { Set(SourceProperty, value); }
		}
	}
}

[joeydee]

Ein Codefeld - etwa für's Adventure? :)

Bei mir waren auch UI-Tage, da nehme ich deinen Beitrag doch gleich mal zum Anlass.
Mein altes Framework eines Immediate Mode Gui habe ich über's lange Wochenende komplett neu aufgesetzt. Ursprünglich war es nur fürs Prototyping, um schnell ein paar Standard-Controls auf den Bildschirm zu bringen, inzwischen schafft es komplexe Layouts mit dynamischer Screenanpassung und nested Controls/Apps, alles mit möglichst wenig Definitions-Overhead. Layout vs. Funktion wird getrennt (was bei Im-Guis ja normalerweise nicht der Fall ist), kommt trotzdem ohne Binding aus.
Damit bin ich auch komplett weg von der Flash-Anzeigeliste und Events, alles passiert auf einem einzigen transparenten Bitmap und rechteckigen Hotspot-Bereichen. Nur die Text-Renderengine benutze ich noch im Hintergrund zum Beschriften, wird aber auch aufs Bitmap gerendert.
Fehlt noch Skinning, war aber jetzt nicht Prio. Ein paar Bugs sind zwar noch drin und es fehlt auch noch einiges, aber läuft, wird auch bei komplexeren Oberflächen nicht zum Bottleneck und stört sich nicht mit GPU-Bereichen.

Das Codefeld habe ich zum Vergleich mal nachgebaut, sieht dann bei mir so aus:
Layout:

Code: Alles auswählen

override public function build(parent:String):void {
  surface.divide(parent, "v", "numpad app:area/title-|display:title.|a.|b.|c.|d.");//vertical
  surface.divide("a", "h", "1:nbt.|2:nbt.|3:nbt.");
  surface.divide("b", "h", "4:nbt.|5:nbt.|6:nbt.");
  surface.divide("c", "h", "7:nbt.|8:nbt.|9:nbt.");
  surface.divide("d", "h", "X:xbt.|0:nbt.|#:xbt.");
}

Funktion:

Code: Alles auswählen

override public function handle(spot:Hotspot):void {
  if(spot.click){
    if (spot.type == "nbt"){//number button
      msg="";//clear message
      if(code.length < 4)code += spot.name;//add number to code
    }
    if (spot.name == "#") msg = (code.length==4?"WRONG CODE":"NEED 4 NUMBERS");//enter
    if (spot.name == "X")code = "";//clear
  }
  if (spot.name == "display") spot.caption = (code == ""?"[ENTER CODE]":msg+"\n"+code);//display
  if (spot.type == "nbt" || spot.type=="xbt")spot.type = "area/button/title";//prepare for default rendering
}

Aussehen:

swf:

numpad.swf

(8.14 KiB) 5905-mal heruntergeladen

Hier nochmal eingebunden in eine etwas komplexere (sinnfreie) Testumgebung mit Flex-Layout und weiteren mehrfach verschachtelten Apps. Dabei sind die Nummerntasten des obigen Pads testweise ebenfalls flexibel, während andere Element feste Höhen haben, das kann man mischen.

[xq]

Ich spüre eine gewisse Konkurrenz :P Ne Spaß, sieht relativ gut aus, aber die Usability und Readability finde ich bei dir etwas gering, ich hab ne ganze Weile gebraucht, um zu verstehen, was genau die Codezeilen beim Erstellen eigentlich machen...

Ich bin gespannt, wie sich das letzte komplexe Feature auf die Usability auswirkt: Templating für List Items und ähnliches. Die Widgets bekommen eine Option, die Kinder an eine Collection zu binden, wobei für jedes Collection-Objekt ein Kind aus einem Template erzeugt wird.

Wenn das gut klappt, kann ich anfangen, mein Adventure auf die neue GUI zu portieren.... :)

[joeydee]

Klar muss einem das so vorkommen, einmal ist "-:|/.|-" etc. eine selbstentwickelte responsive Layoutsprache die sich nicht gerade vom Anschauen erklärt, und zum anderen ist der Umgang mit Immediate Mode (IM) eine ganz andere Philosophie als mit handfesten Control-Objekten.
Beides hat sich für mich aber längst bewährt, ist gerade bei komplexeren Layouts am wenigsten sperrig zu schreiben, gut zu warten, ich kann es auch nach Monaten Pause noch lesen, und IM lässt sich gerade für's Prototyping mal eben schnell überziehen um Objekte direkt zu manipulieren und auch genauso schnell wieder spurlos entfernen, ohne dass man sich um eventuelle DeepLinks, verwaiste Eventhandler u.a. kümmern muss (habe da in der Vergangenheit schon einiges ausprobiert).

[xq]

Ich muss hier nochmal zum Verständnis nachhaken:

Immediate Mode wäre Unitys OnGUI. Ich zeichne die GUI, prüfe gleichzeitig auf Events und führe die Befehle bei Bedarf aus. Und das mach ich, solange ich die GUI sehen will, wenn ich nichts aufrufe, sehe ich nichts?

[joeydee]

Ja, das hört sich ganz danach an.
Hier war der Thread der mich dazu inspiriert hatte (2104, von CodingCat): http://zfx.info/viewtopic.php?f=7&t=3317&p=41788
Im dritten Post kann man erahnen, dass ich den IM-Ansatz nunmehr seit gut 2 Jahren nutze :)
Ich mache da allerdings einen mehrfachen Pass, sonst geht das mit responsiven Layouts nicht (d.h. Größe/Position des ersten Buttons kann auch von späteren Elementen noch beeinflusst werden) - das ist aber eine eigene Geschichte.
Das zentrale und direkte Prinzip der Objektmanipulation bleibt aber dasselbe.

[xq]

Ja, ich denke, wir haben auch völlig unterschiedliche Einsatzzwecke. Ich finde, bei so immediate mode UIs hat man halt doch einen höheren aufwand bei der erstellung und ist imho auch nicht so superflexibel im neu anlegen oder objekte verschieben (hängt natürlich auch stark von der verwendeten API der UI ab).
Bei mir ist es jetzt auf jeden Fall möglich, Binding Sources neu zu binden, damit kann ich jetzt mit großen Schritten auf ein Template-System zulaufen

[joeydee]

Das ist eines meiner aktuellen Projekte. Ein kleiner Platformer bzw. Labyrinthspiel im klassischen 2.5D-Iso-Look. Die Basislogik ist gemacht, im Moment mache ich mir Gedanken über Sammelobjekte, Schalter etc., mal sehen wozu ich Lust habe und wie lange ich durchhalte. Aktuell gibt es nur verschiedenfarbige Pillen (die große blaue ist der Spieler) und als Levelelement nur Würfel in verschiedenen Grautönen, mit irgendwas muss man ja anfangen. Und heute mal ein Platzhalterbild als BG platziert, um zu sehen wie sich das Ganze als Space-Theme macht. Der spartanisch-abstrakte Level-Look gefällt mir irgendwie.


Mein UI ist aktuell auch hier im Einsatz: Ein kleiner, mit den jeweils zu testenden Features mitwachsender Leveleditor, um ein paar Testlevel direkt im Game-Modus anhalten, Dinge umplatzieren, Parameter verändern und die Auswirkungen testen zu können.
Nein, das UI ist hier nicht wirklich hübsch, aber funktional und unkompliziert anzupassen. Lässt sich auch skinnen, also am Ende auch Ingame-tauglich. Brauche dann nur einen neuen Textrenderer.


Ein größerer Levelausschnitt. Das ZFX-Logo lässt bei genauerem Hinsehen grüßen ;)
Sich in einer Escher-Realität bewegen und immer wieder umdenken müssen ist beim Gameplay eine der Herausforderungen.
Hört sich reißerischer an als es ist, und wahrscheinlich überfordere ich den Spieler wiedermal gnadenlos. Egal, Hauptsache experimental und mir macht's Spaß und ich hab was zu tun ;)

[marcgfx]

@joeydee: sieht cool aus. ich nehme an die escher-realität hat nicht nur kosmetischen einfluss, ich frage mich nur grad wie es funktioniert :)
kann die welt gedreht werden? hätte dieses projekt keinen eigene thread verdient?