MEDMI 2019 – A conference on technology and digital marketing, November 16, 2019, at Medellín, Colombia.
Sergio Roldán kicked off the event discussing the growth of Medellín from a spot in the valley to a mostly unplanned big city, and the strategies it has taken to transform into a growing technology hub, investing in the citizens, including improving education facilities in the most troubled zones.
Natalia Silva and Daniel Arbelaez talked about Service Design, the importance of understanding the elements that are really relevant to the persons in a process, including the people participating behind the scenes, not just the final clients.
Diego Noriega thinks “How” to make a company grow is not as important as “Why”, and with “Who”. Having a lot of money brings the need to spend it and may accelerate failure. Moments of failure, however, can be the biggest moments of learning.
Andres Ramírez, a director from Asobancaria, shared a history of innovation in the financing and banking sector in Colombia, and the latest advancements in fintech and ePayments.
Maria Camila Muñoz, Pablo Santos and Juan Esteban Saldarriaga, discussed the interaction between fintech companies and banks; instead of competing, fintech providers provide access to resources via improved user experiences and lower barriers.
Ivan Obando shared the process of producing his movie “Me llevarás en ti”, including ideation, planning and financing, and some of the elements that have aided its success (local historical hero, romance, involving local celebs).
He also voiced his concerns for national productions to have proper exposition, and how he’s working with government agencies on this topic, proposing incentives for cinemas for keeping national pictures on the billboards for longer times.
A representative from GRIN Colombia said the company hopes to transform cities by improving mobility, increasing employment, making people value public property and creating safe spaces.
In the Innovation panel, Monica Zuluaga and Andres Ramirez discussed how, from their corresponding perspectives in media and banking, large traditional companies are adapting to the consumption habits of born-digital consumers, by distributing content through different channels and by creating alternative means to access services for people for which things such as going to a physical bank are extraneous concepts.
Companies need to move quicker in modern times since even small companies or startups can now compete directly with bigger ones via a greater understanding of their users or audiences.
Eduardo Guizar shared how he wound up working in the Curiosity project in the NASA, following his childhood dream of making robots, after watching a Star Wars movie. He never abandoned his far-fetched dream, secretly developing robotic engines at his home in Mexico.
It’s been almost three months since the last update. And many things have happened!
We are progressing thru the CREA Digital project (ending this month). We’ve been working for the last 10 weeks.
Doing a full changelog would probably be huge. Instead, I’ll share some pics of the more visible changes, noting that there are also great advancements in the music and sound effects.
As part of the work in the new UI, we have rearranged the transfer items dialog and implemented some visual enhancements on it and the other dialogs of the game.
One of the most visible changes from the last update is the appearance of forests, still a work in progress but it seems at long last we’ve found a way to represent them adequately and performing well. It’s no longer a flat texture and it still conveys the sense of scale that I’ve wanted to portray in this overworld view.
This is far from the definitive look we want. We are still working on the lighting of the scene, the colors, contrast, and other graphical tweaks. As well as creating more models for the overworld locations.
Landing and boarding, as well as linking the party units model and the inventory model, so that the units you have in combat actually match the ones in your inventory.
Another aspect that was worked on heavily was the UI, including the HUD elements, the appearance of dialogs, and the size of texts and elements. We also added new indicators for the day and night cycle, the weather, and made the minimap show the immediate surroundings (instead of a scaled version of the entire map)
The idea to use a vignette to simulate LOS has been discarded for now. Zoom levels are now fixed too, so we are not emulating LOS at all. I believe this was an unneeded level of complexity.
Speaking about the map, a lot of work was put into redesigning its look. Not all of it has been implemented inside the game already (only minor parts of it).
Below we can also see the helper character, our initial effort to enhance the onboarding for new players with a “soft” tutorial. We have also been working at updating the portraits system with a new style and new sets for the native people.
There has also been some progress in the illustrations for the campaign cutscenes, although we are reworking it with a different style.
Combat has mostly stayed the same. However, we are doing a lot of work in redesigning the units, modeling them and creating new animations. We are in the process of integrating them into the game so hopefully, this huge chunk of work will be more visible next update.
Now, for some work that is less visible:
We have designed the entire layout for the Children of Bachué campaign, including defining 6 missions with different feelings and objectives, creating locations and populating them with over 50 NPCs with their dialogs and appearance. A lot of research and design work has gone into this.
As noted above, creating music, sound effects, and integrating them into the game, has been quite a bit of work. I’ll post a gameplay video soon so this can be heard.
Planning and casting for the voice over for the cutscenes
Refactors in the engine to support multiple food consumers
Support for the cutscenes with fading images and text, with automatic playback.
Creating mining camps
Returning to Spain sequence
Use procedural terrain for Children of Bachue missions.
JSConf Colombia 2019, October 18 and 19 at Medellín, Colombia. I was a speaker there for the first time. Here is a brief summary from the talks I was able to check out, based on my live-tweeting. The full talks will soon be available at JSConf youtube channel.
First off, the opening live coding show by algo0ritmos, led by Celeste Betancur. An electronic music and video visualization show where 3 coders connected to a server to manipulate different aspects of the audio and video in realtime.
Sergio Quintero, a local, discussed skimming data hacking via malicious scripts injected into legitimate websites to steal information, and how it can be prevented by intercepting XHR calls using a client-side firewall.
Luis Alejandro Vega, from New York, shared his experience building a career at Bloomberg, as well as how adding “pet characters” to the in-house projects helped increase the ownership of the team over them as well as the visibility for other departments of the company.
Mayra Rodriguez, from Bogotá, discussed the reactive app architecture and shared some tips to achieve good performance in your web app using RXJS stores.
Irina Shestak, from Germany, shared her experiences with Rust and WASM, with lots of tips to make coding, debugging and deploying easier, which she learned thru her quest of learning on the go.
Melina Mejía, a local, spoke about web accessibility being critical to reaching all audiences, and how to implement an accessible interface using ARIA.
Santiago Zapata, a local, did an amazing talk about procedural generation, including an introduction to it, where it can be useful, and a break down of his procedural castle generator.
Missed talk by Anton McConville, from Canada. “Personality hacking: using Node, WebAudio and Houdini to visualize psychology of song lyrics“:(
Vanessa Marely, a local, talked about the power of storytelling as a way to better communicate ideas, and gave some tips for good, effective storytelling.
Missed talk from Kate Beard, from England, “Learn How to Play the Theremin* Today, Guaranteed!” 😦
Adrian Bolonio, from Austria, dug deeper into the issue of web accessibility, focusing on the tools to test it over different aspects of a webapp (code, DOM and final appearance in the browser), including simulating visual impairments of different degrees with NoCoffee.
Jerome Hardaway, from Tennesee, talked about how to make it easier for people to jump into existing software projects. Remove ego from your code, code for the others. Design the onboarding process seriously around building the confidence of new team members. Document and refactor.
Daniel Rico, a local, briefed on how container-baser deployment enables horizontal auto-scaling, and shared the results of his experiments to find degradation points in NodeJS vs Tomcat, which can help finding out the number of nodejs instances required for your app.
Colin Ihrig, from Pennsylvania, gave a very useful walkthru of some diagnostics and debugging tools included in nodejs out of the box, when and how to use them.
Jessica Lord, from New York, shared the history of Electron: going beyond Atom, avoiding a scaffolding approach ala rails, the importance of clear and maintainable docs and building a community around the new tech. Developer Experience is critical for a successful tech tool!
Missed talk by Luis Villalobos, a local, “Desarrollo de interfaces modernas de usuario usando un “viejo” modelo matemático computacional” 😦
Bryan Hughes, from California, believes programming can create art just as any other technology (such as watercolor or oil paint) can. It’s all in the intent of whoever is using the tech: is it to convey emotions or facts? Finding your style is a mix of chance and determination
Finally, Eva Ferreira, from Argentina, went into a trip 10 years back to the past on web development, how things have changed for good and the history behind these improvements. But also how some things have gone amiss… abuse of push notifications, privacy breaches, popup madness, websites heavier than needed, lack of accessibility, fatigue for new frameworks… where are we heading to, can we do things better?
I managed to participate in the competition for the third time in a row, this year I created a monster-catching game. You can play online here or here. Source code is here.
The game itself is pretty simple, you walk around the map using the cardinal directions, and when you land on a spot you may find a monster and catch it. Both moving and attempting to catch a monster will consume your action points, which replenish automatically every 20 seconds to a maximum of 40. It works in both mobile and desktop browsers.
The organizers were encouraging the participants to integrate with coil.com and XRP tip bot to monetize their entries, I implemented a simple bonus for coil subscribers (they get a 25% bonus on the speed for action points to recover). So far I have received 1.08 XBR (That’s Ripple cryptocurrency, converting to about 0.3 USD today)
What was my motivation this year? I was really hesitant to participate since I’ve been busy with other projects and just participating for the sake of it was not enough of a reason. Certainly, after last year’s results, I didn’t care much about “winning” the contest.
So, in the end my motivation ended up being merely to create an interesting procedural generator, to hone my procgen skills. I had just tried to participate in “Advanced Topics in Procedural Content Generation” online summer school provided by the IT University of Copenhagen and New York University, where I was able to watch some talks and gain some insights, but failed to participate in the course project.
The weeks before the challenge started I had an idea for a procedurally generated sports event (that thing has been in my head for some time now), but it was not very compatible with the theme they announced (“Back”). For most of the month, I couldn’t come up with something fun and interesting, that only managed to happen in the last week. So I started late and only managed to invest about 5 days on it, but the last days were super intense.
Being a pokemon fan (and a somewhat proud genwunner), I always wanted to create a monster-catching game (well, I kind of already did). Some years ago I was even working on a Pokemon Go-like game, but it never lifted off due to missing some original designs for them monsters.
So, I thought I could take another stab at a similar project, using procgen to fill the gap. I started by analyzing some pokemon anatomies and coming up with their structure and even used tracery.io to have an idea of how this “taxonomy” was looking (I had wanted to use it for something, for years :P). Sadly I didn’t include these descriptions in my final entry. (then again, I dunno how big the JS lib for tracery is)
Then, I started setting up the project, reusing the structure from my previous entries. In keeping my idea of NOT using pixel art on new projects, I thought of reusing the vector rendering routines I had used in these previous entries, however, the shapes I was planning to use were going to be more complex (I was initially thinking on trying to replicate the look of the original pokemon, like this one), so instead of just coding them by hand I used some online SVG editors and then manually translated the SVG instructions into my rendering routine.
However, as I needed to produce more complex shapes (mainly supporting bezier curves), I found out it would be more straightforward to generate SVG objects rather than extending the “vector script” I had in place, which by coincidence was pretty similar already to the SVG path definitions. This became more important as I looked for ways to get an artist to help me with content for the game since I would have had to translate SVG into my own script language, either manually or automatically.
So I ditched rendering paths and shapes into the canvas and instead started experimenting with generating SVG components from code and overlaying them using CSS.
As the deadline drew closer, it became obvious that I would not be able to replicate the appearance of the reference I had for the monsters in a convincing way. I looked around a lot and finally found something in Etsy that I could use as a reference for my generator. (sadly, the store and the item itself seem to be gone now. Good timing for me tho!)
These designs had several advantages:
They were portrayed as a symmetrical front view
They were more “symbolic”, without relying on individual poses for personality.
They were “inspired” by the original Pokemon designs, so not a direct knock-off.
They were already provided in SVG format.
I bought it, thinking I could at least cut and paste the different body parts and use them as individual SVGs, but my skills with both Illustrator and Inkscape proved not to be enough for it. Luckily, js13k colleague Rybar came to the rescue and helped me with the task, probably having to redo a lot of SVG work following the references.
Now with the individual SVG assets provided by Ryan, I could finally advance in the actual generator, having, at last, some progress to show.
The generator works by picking a random “anatomy” which determines the body parts slots the monster will have, and their location. then it proceeds to select a random type of body part for each slot and positions them together using some anchor points.
It also picks a random “pastel” color for the monster, I did some research and found out an easy way to generate them was using the HSL model, and having both Saturation and Lighting at 70%, and picking a random Hue. Luckily, CSS supports defining colors with the HSLA notation so this was pretty easy to include.
I also build a simple, syllable-swapping based name generator for the monsters. It generates names using two to three syllables, picking from a random list of consonants, vowels and a possible third consonant, for each syllable.
It’s also worth noting that this generator is seeded, which means the “races” of monsters that are generated are always the same, and all players will get the same set! For this, I reused the simple (on implementation!) but effective Park-Miller LCG
Now that I was finally generating some content, I focused on creating an actual game around the generator. I knew from the onset the game would not be deep, but there had to be a game!
I created a world represented by a 10×10 grid of locations and added a simple name generator for them (reusing the monster name generator but also adding some flavor with location types and colors). Also added the energy system to move around and catch the monsters, to serve as a barrier for content consumption.
In the world model, I placed lists of monsters for each location, considering their “rarity” so that very rare monsters can only be found in a single location, and so on. The idea being that players could share their findings, creating something of a social aspect to the game (Hey, what monster are you missing? I found Lesense in the Temple of Serkekol!).
I added a simple model to keep track of the monsters you had captured, and a view where you could see them.
I had managed to have a playable game one day before the deadline, so I could focus on enhancing the UX and testing. Needless to say, this ended up consuming a lot of energies but the end result was very good.
I managed to include a music track (thanks again to Rybar for creating it!) and even modified it in the tracker to make it longer (first time I make something useful using a tracker). We used SoundBox again (here‘s the final version of the track)
I also made the game public and asked around for suggestions to improve it, one of them was adding more variations to make the monsters feel more unique. I fired Inkscape and drew a lot of horns, antenna, mouths and some tails, and also defined an additional anatomy with no “body” (just a head with things attached to it). The structure that was in place made it very easy to add new content.
Also, in order to add some “depth” into their appearance, I was suggested to do some shading into the bodies, which I managed to do with the help of Prinfexita, a fellow indie dev from Colombia. She drew the shadow shapes and I added support for them into the generator (including producing a darker version of the body color)
I also did a LOT of tweaks on the user interface, to make navigation easier for the players and provide a cleaner experience, especially in mobile.
What went right
I was able to create a finished, stable and polished experience
I learned a bit more about SVG
I created something technically different than last year entries.
The monsters look cute.
I was able to collaborate again with Ryan Malm, for the first time with graphics and for the second time with music.
Inadvertently, I think I managed to do just what I set to do from last year’s postmortem:
An easy game, rewarding players without requiring lots of skill.
Gorgeous visuals. (Maybe??? :))
What went wrong
Nothing really went wrong, however, there are some core things I wish I had managed to include to make my entry more fun:
A scrolling map view of the world, since right now it relies a lot on the player imagination
Deeper gameplay mechanics for catching the monsters, maybe collecting some items in the world that would help you lure them.
Allow trading monsters with other players.
More body parts, especially Wings and tails
Scaling variations for the monster’s appearances.
But all in all, I’m very happy with what I was able to create in the short time frame.
However, I got pretty sick and weak for two days after the deadline, I believe I pushed too hard. Would be better to avoid crunch by starting earlier.
I never intended the game to be more than just a collecting game, so things like a plotline or a combat system were willingly ignored.
Some other things that would have been nice to have, as possible points of expansion:
A more in-deep generation of the monster anatomies beyond randomly selecting and swapping parts.
It’s been 44 days since the last update so let’s go!
CREA Digital winners
We were selected as winners for “Crea Digital”, a program from the Ministries of Culture and Information Technologies of Colombia, with “Expedición: Los Hijos de Bachué”. This will be a scenario based on the Muisca legend of Pacanchique, and the last years of the Muisca Confederation in the central Andes highlands. We expect to make good use of these funds to enhance production, art and UX aspects of the game while producing quality content to be distributed across the country, inspiring children to become game developers in the future and teaching people about their history.
Changes in Exploration
After a lot of experimentation with the forests, including tests with 3d meshes, I decided to tackle the forest issue with a change of perspective. Of course, this isn’t a magical solution but I believe it’s closer to the sense of scale I want to portray.
For the “New Expedition” mode, the player now starts on land in the southeastern-most part of the map, using an adequate sea vessel based on the selected culture.
Regarding field of view, our first approach was to use zoom levels for this so that if for some reason your field of view was restricted, the game would zoom in so that what you could see would fit all screen. I found out this to be a bit confusing and troublesome from the art part, so we are now using a “vignette” effect instead.
We are also now detecting if the expedition is transversing a forest, in which case it moves slower and the field of view is also limited.
Worked further in procedural generation, adding controls to ensure a percentage of the map is above the sea, and smoothing out the mountain peaks to make them look more natural.
Hometown and Transfer Items
For the “New Expedition” mode, the player adventure will start at his “hometown”, where he must stock his Expedition to the unknown. He may come back to town to trade and restock.
The UI is still very early but finally settled on a design for this multipurpose interaction, which will also be used to trade with native towns, and to transfer things between the expedition and locations such as ships and outposts.
The current approach for the long voyages in the open sea. It will be a separate mode in which events will be simulated and things will be handled at a higher level. Will probably add some navigation and weather aspects, as well as events with the crew.
Added a permanent minimap on the lower-right corner of the HUD, and compressed lots of UI info into the status panel in the lower-left corner. Also increased the size of the Town and Conversation dialogs and relocated them.
Also, after lots of research and experimentation, we were able to add “markers” for the command destinations, painting them over the terrain using “projectors”.
After evaluating different alternatives we settled on handling rivers as meshes generated from polylines (sequences of points), in order to provide more flexibility for their procedural generation. We also added animation to their flow. Their appearance is still work in progress.
Sound effects tests
We introduced speech effects for “commands” as well as random “expressions” from the expedition members during exploring, as well as new sounds playing when the units are injured or die. This is all still in test.
Was considering what would be the best way to do this. LOS in Ultima 6 is weird since it seems to be location-based (once you open a door you can see the room inside), but you can see through walls (some times?).
I thought just replicating it for the sake of it didn’t make sense and would bring more complexity for map handling and editing. So instead I went for a full system with opaque tiles, so you just have to define the tile as opaque and the engine takes care of the rest.
The current implementation is a pretty simple raycasting, and a mask drawn over the map. It works almost great except the tweening of the mask moving is not in sync with the camera tweening, which causes some small artifacts in the mask border.