HOME
PROJECTS CV ABOUT ME & CONTACT

SS14 Map: Xeno Station

This map for the game Space Station 14 is my first full station, designed around the theme of an alien spaceship having been recently taken over by the player corporation. It features custom art assets, unique layouts and a design philosophy of making every in-game department have a twist on normal gameplay. Overall it’s meant to convey a sense of being out of place and adapting to an unfamiliar environment, while still ensuring that gameplay runs smoothly for both new and experienced players alike.

Some key design features:

– Corridors and maintenance paths use unconventional layouts, featuring more turns and tighter hallways than normal. This is offset by having plenty of signage to assist in navigation, as well as clearly marked-out map spots. Getting from point A to point B faster may involve taking shortcuts through maintenance tunnels, allowing for more experienced players to learn the layout and optimize movement.

– The Medical department is unusually split up, with the Chemistry sub-department physically disconnected from the main Medical Bay. To offset this there is a protected disposals pipe network that allows travel between Medbay and Chemistry, and Chemistry is given a small mini-bay to assist with treatment and encourage interactions with crew (which is especially suitable since Chemistry is next to Cargo, which will likely have injured Salvage Specialists travelling through).

– The Anti-Matter Engine is located in the wide open space between Science and Medical. Other stations keep it in an enclosed space inside of Engineering to hinder sabotage, but by having it in such an open area this ends up being balanced by the fact it’s now too public to sabotage. This is also offset by Engineering’s other main power generator, the Singularity/Tesla generator, being pre-setup meaning they can quickly transition to stronger energy should they need to.

– Security’s Permanent Confinement features a unique feature by having the room consist of only 3 walls; the fourth one is instead made up of a containment field, usually reserved for Singularity/Tesla containment. Turns out this works very well for containing prisoners too!

– The maintenance tunnels to the far east of the station contains a section that is blocked off via barricades. Inside, a map-unique alien mob named “Lone Praetorian” stalks a dark labyrinth. It’s intentionally not lethal and provides a speed-boost upon hit to help a player encountering it escape, but the fact it is inside of a dark section of the map means it’s very effective at causing jumpscares for unsuspecting players.

These are but a few of the design choices made for the map. During playtesting it has consistently ranked in the top-half of the map pool and has been seen as a fun and exciting addition to the game.

GMTK Team Finder

I got the chance to be the UX Lead on the GMTK Game Jam 2021 Team Finder, a website where game jam (game development contest) participants could find people to form a team. The application was created within 6 weeks with the help of a team of six people, with my responsibility being the front-end UI and UX design along with another team member. For the project I created mock-ups of various UI elements and then implemented them into the site. The site featured a team list, register, FAQ and admin page.

The Team Finder ended up with cirka 1400 created teams and almost 100,000 back-end queries. The site was well received by both jam organizers and users, and there are plans to further develop it for the 2022 game jam.

Wyvern Techwear

A collaboration with one of my friends specializing in graphics design. The aim of the project was to create a 3D model for a techwear facemask. After iterating through various sketches we settled on what we called the “Wyvern” pattern, which we refined into a more functional look. I used the concept art to create a 3D model in Fusion 360 and brought it over into Blender for part adjustments.

Exercise App

I was contacted out of the blue by a programmer who was interested in doing a smartphone workout application as a way to improve their programming skills. Seeing as I wanted to get my experience doing UI, I accepted.

The application allowed the user to define their own exercises and then create workouts that they then can follow. I was given control over the overall design and userflow, with work progressing first in Figma and then Unity. Below are images of the Figma flow and layout prototypes. The app ended up never fully realizing in the end, but it was still an excellent learning experience.

tobiaswidmark.se

My portfolio website. The initial version was fully programmed and designed by myself, using a mock-up created in Illustrator and programmed using HTML, CSS and Javascript/Jquery. The second (current) version uses the same design but has been incorporated into WordPress as a heavily modified WP theme, allowing for easy updates on projects.

The design is inspired by portfolio sites like Ben Fearnley and a wish to have somewhere unique to put my projects. This gave me a great opportunity to expand on my HTML and CSS knowledge, as well as develop my visual design skills.

Cartography Game

Since I had studied extracurriculars during my university years, at the last quarter of 2020 I had the opportunity to only study at 50% without penalties. With the extra free time I solo-prototyped a game based on cartography as a way to hone my game design skills.

The basics behind “Map Project” relied on the concept of triangulation: by knowing two points on a map, you can use sight angles to determine the placement of other objects in the real world. The game tasked you with mapping out the roads and buildings of the surrounding area using a few known points of interest.

To see if the idea was viable to begin with, I first conducted a test in the real world with the help of a ruler and compass. I assigned a 100 x 100 m area near my home, marked two known points on the map and then went out to see if I could get an approximation of the layout of the surrounding area by measuring angles from a compass and comparing them on the map. Unfortunately I had access to neither a real compass nor angle ruler so I had to use smartphone apps which weren’t that accurate, but in the end I not only managed to make a map that had a resemblance to the real world but I also had fun doing it.

The next step was to create a prototype in Unity. Through the use of texture editing shaders, a simulated compass and sparse level design I recreated the real life test. The difficulty of mapping out areas could be made more or less complicated via several factors; adjusting the number of sightlines to known points, making complex pathways, hindering the player from walking to where they wanted to draw etc. I also hosted playtest sessions with my friends to see where the UI and UX could be improved. Sadly the project had to be dropped as the next university semester began.

Map Project still has potential and I’d like to revisit it in the future.

Lightframes

Wall art lamps created for a university course. The lamps consist of colored led strips and lasercut cardboard, with a transparent tracing paper at the back to diffuse the light. The frame itself is a modified IKEA picture frame.

Ten lamps were created and sold; five to friends and family, five to strangers over the internet.

 

R-99 SMG

Prop of the R-99 submachine gun from the game Apex Legends.

Created in lasercut EVA and 3D-printed PLA. Has a simple circuit inside that allows LED lights to rapidly blink in the barrel of the gun when you pull the trigger. The blink speed is 18 blinks per second, which matches the firing rate from the game.

Rickenbacker 4001

A prop Rickenbacker 4001 created in MDF and poplar. The buttons are 3D-printed and fret markers made in resin.

Created for an unfinished FLCL Canti cosplay. Unfortunately it is unplayable, but at least the strings are real (if busted)!

Computer Case

Designed, 3D-modelled and built by hand, for when I was putting together my new computer. The design is inspired by Art Deco with the goal to have a vaulted top to the case.

 

The 3D models are created in 3DS Max together with Substance Painter for the textures. Once a design was chosen, the model was used as a stepping point for creating a blueprint in Adobe Illustrator that could be used to cut the parts out in 5 mm MDF, using a laser cutter. The vaulted top was covered in EVA-foam, which was then covered up in a single sheet of wood-pattern vinyl. The case was then placed on top of a metal frame which contains the computer components.

 

The EL wire is powered by the RGB light output in the computer using a connector I soldered on myself. The button panel was too small for the frame’s circuit card, so I had to cut it in half and solder together the connections using wires.