dietergeerts

Hello!

I'm Dieter Geerts and currently creating this 'about me' page, so all of you can read about me, the projects I do and the tools I use for them. Stay tuned...


Skills

Dutch/English UI/UX Design RFP (Reactive Functional Programming) Test Driven Development Web Application Architecture Toolkits/Styleguides SPA (Single Page Applications) Agile/Scrum Web/UI Design/Prototyping Mentoring/Helping out Plug-ins/Scripting Functional Analysis

Tools used

Last 6 months

Application and Data
JavaScript
TypeScript
HTML5
CSS3
Sass
Node.js
AngularJS
Angular
UI-Router
Bootstrap
UI Bootstrap
ng-bootstrap
RxJS
Lodash
Moment.js
Font Awesome
Handlebars
MongoDB
Utilities
Fabricator Builder
jsdoc
DevOps
IntelliJ IDEA
Wallaby.js
Babel
EditorConfig
Webpack
Gulp
Mocha
Chai
Sinon.JS
Protractor
Karma
Jasmine
Git
GitHub
Bitbucket
npm
Artifactory
ESLint
TSLint
Istanbul
Coveralls
Code Climate
David DM
Travis CI
Jenkins
Business tools
Adobe XD CC
Paint.NET
JIRA
Confluence
Slack

Last year

Long ago


Experience

New Healthcare related project

Role Senior UI/UX/FE Web Application Engineer
Logs September ... May 2017

Currently working on a new project in Healthcare, which will be used globally around the world. I can’t tell more about it right now due to a NDA I signed. Stay tuned for more info….

I am hired for web application parts, and my focus is mainly on application architecture and devOps (testing, bundling, developer experience, …), while mentoring the junior software engineers.

HTML5
Sass
AngularJS
UI-Router
Fabricator Builder
IntelliJ IDEA

Fabricator Builder Next

Role Owner && Lead Software Engineer
Logs September ... May 2017

The next iteration of my Fabricator Builder, still work in progress though.

Fabricator Builder is a ‘build’ tool for creating toolkits. These toolkits can help speed up development and be used as styleguide and documentation. You can also use such tookits in different projects that needs the same styling and frameworks. Think of a toolkit as a small personal bootstrap.

More info can be found on the wiki page of the original Fabricator Builder.

HTML5
Sass
Node.js
IntelliJ IDEA
Webpack

myStaff application

Role Senior UI/UX/FE Web Application Engineer
Logs May 2017 ... December 2016

Solvice approached us to collaborate with them and take over their web application, which demonstrated their optimisation service. Their intent was never to create own applications, but invest in their optimisation engine, which makes use of OptaPlanner, and have applications make use of it. So this is where we stepped in. After assesing the existing demo application, it was clear that it would be too difficult to adapt it further and add new functionality, as it was fastly written purely for demo purposes, so myStaff was born.

We built it from the ground up in a modular way, so new modules can be added afterwards easily. The main focus for the first product release is on hospitals, though it’s being developed with all kinds of organisations/industries in mind.

I took on the whole FE part, including UI/UX. One of the goals was to give the product it’s own distinct look & feel, and make it very user friendly. Together with the functional analyst, I also worked on the UX process with the help of tools like Adobe XD, trying to improve the interal UX process in our organisation and working more user oriented for own products.

TypeScript
HTML5
Sass
Angular
IntelliJ IDEA

Fabricator Builder

Role Owner && Lead Software Engineer
Logs January 2017 ... July 2015

Fabricator Builder is a ‘build’ tool for creating toolkits. These toolkits can help speed up development and be used as styleguide and documentation. You can also use such tookits in different projects that needs the same styling and frameworks. Think of a toolkit as a small personal bootstrap.

More info can be found on the wiki page.

JavaScript
HTML5
Sass
Handlebars
IntelliJ IDEA
Gulp

myHealthbox GP portal

Role Senior FE Web Application Engineer
Logs November 2016

A portal for the general practitioner to create appointments and keep track of his calendar. Not created as a module for the myHealthbox suite, but custom made for the AZ Delta hospital.

I was called to help out with the more difficult parts and mentoring the junior software developers, due to my recent experience with the used tools.

I always liked to mentor/teach others, and took the lead in this where needed for previous jobs, though it wasn’t part of my job description. I think it’s important as a junior to have a mentor that can help you get better faster, growing more confident, teaching you valuable things to improve yourself over time more and more, and maybe be a mentor yourself one day.

HTML5
Sass
AngularJS
UI-Router
IntelliJ IDEA

myHealthbox prototyping

Role Senior UI/UX Web Application Engineer
Logs October 2016

Upon further improving our myHealthbox product line, we wanted to create some UI/UX prototypes for new functionality to see how they could be integrated into existing systems and to test it out with users. Some of these prototypes where also be used for public tender.

HTML5
Sass
Fabricator Builder
IntelliJ IDEA

Schoolonline planner module

Role Medior UI/UX/FE Web Application Engineer
Logs September ... April 2016

Schoolonline wanted a replacement for their existing planner module and add extra features to it in the process. The goal was to have a very user friendly planning module, so teachers can use it to plan their courses, but more importantly, administer their content and study books, keep track of their yearly goals and have reports generated, as these are required for the official plans an are used as proof of the given materials.

I mainly focused on the toolkit, which includes custom components and UI/UX styling. We Tried several existing calendar modules out there to see if we could use those as a base, but after some research and several prototypes, we concluded that it would be too much work to adapt them to our needs, so we created our own calendar, specificly tailored to our needs, which took the most development time, to have it as easy as possible.

Together with mono, we worked on the UI and UX part. They especially focussed on the analysis and user testing, while we did more of the actual implementation, adapting where needed.

HTML5
Sass
AngularJS
UI-Router
Fabricator Builder
IntelliJ IDEA

DWorks Vectorworks Plugins

Role Owner && Lead Software Engineer
Logs September 2016 ... April 2007

After several years of creating Vectorworks plugins in VectorScript, the built-in programming language which really took a lot of Pascal, I switched to using python from the moment it was available. This made it possible to create plugins more easily, faster, and with a lot more possibilities.

With the start of creating python based plugins, I also started with DLibrary, a library for easier plugin creation, which hides away all inconsistencies and gotcha’s/bugs you had to know, as all API calls were copied from the VectorScript language. The first main focus of this library is to have form creation very easy by adding an xml layer to visually lay out the form, and using it by adding a data layer that then get’s coupled with two-way data binding. The second focus was on development experience and to quickly setup a new plugin and all it’s behaviours. DLibrary is open-source, and though I’m not active on it anymore, can still be used to create Vectorworks plugins with python. I really hope others can still contribute to it and make it even better.

I’m not active on it anymore, because I had to stop my business as of medical reasons, and it was a very hard decision to make. As I didn’t want my plugins to go to waste, I put their repositories on public, so everyone can use them, and maybe add some new features.

During this python period, I had the change to work out some great plugins for some customers, putting my skills to use and covering the whole package of delivering software from start to finish. I did it all, from project management, to the analysis, implementation and delivery. I really learned a lot from this and take all of it with me in my further career.

I would also like to thank the Vectorworks scripting community again. Each of them were really great and helpful, and I really enjoyed being around. I really believe a great community can make a product so much better, and I love helping others, and being helped when needed.

Python
IntelliJ IDEA
Vectorworks
Confluence

Planon data migration

Role Project Manager && Functional Analyst
Logs March ... January 2016

One of the projects of our Business Analytics division had gotten in a very bad state, and the one working on it had to go on sick leave. With no one available there, they asked me to take over the project for a very short time, as it was already supposed to be ended, and save it.

With no other direct projects, I said yes and stepped up to save it. The project was about migrating data from several systems to the new Planon system. After the initial data migrition, a continuous one will be setup for data that is being administrated in other system, but is needed in Planon for use in references.

With all information and development already done in so many places, I started to gather it into one central place, using Confluence, so we could clearly see the current state and what things should be done. With all this in place, we worked out all missing parts in collaboration with the client end were able to finish this part of the project.

With this project I had the chance to show off my skills as project manager and functional analyst. Especially the last is important for me, as imho, being able to think like a functional analyst makes me a better engineer.

SQL Server
JIRA
Confluence

Qlik demonstrator

Role Medior UI/UX/FE Web Application Engineer
Logs January 2016 ... December 2015

Our Business Analytics division was looking into using Qlik in future projects, so a customer can easily see live data changes and analyse it. Before commiting to an agreement between our company and Qlick, we wanted to see in how far we could make use of it, even the possiblity to integrate it into apps the Business Applications division creates.

So I was asked to create a demo project together with someone from Business Analytics. I took the UI/UX implementation on me and created an application as a Qlik Sense mashup.

HTML5
Sass
AngularJS
IntelliJ IDEA
Qlik Sense

CODEX VEB interface

Role Medior UI/UX/FE Web Applicatin Engineer
Logs December ... October 2015

The client wanted an application to solve a specific problem: The big database wasn’t always available, but work should be able to continue. So They wanted an application to work with the data, that would sync when the database became available, but stored the data locally on the company database when no connection could be made.

We created a simple ASP.NET MVC web application, as all operations were simple crud ones, and the application would only be used by people that did know the data inside-out, so no need for special UI/UX requirements. I again was lead engineer after the successful previous ASP.NET project.

HTML5
C#
Bootstrap
ASP.NET
Visual Studio

HospIndex data provider module

Role Medior UI/UX/FE Web Application Engineer
Logs October ... September 2015

HospIndex is like the GoldenPages for hospitals. We created the data provider part, where hospitals can manage all their data. This web application used the provided REST api to get and store the actual data. We also did custom authentication through the provided web services. I was lead engineer as the one with the most ASP.NET knowledge in the company. UI/UX has been decided in collaboration with the client.

HTML5
C#
AngularJS
Bootstrap
ASP.NET
Visual Studio

myHealthbox

Role Medior UI/UX/FE Web Application Engineer
Logs August 2015 ... December 2014

Our very first product, based on a project we did for a hospital. Being the first one also implied a lot of difficulties, especially on transitioning from a project based workflow to a product based one. This was also reflected on the actual product, behind the scenes, but we learned a lot from it.

The product consists of multiple big parts/modules and was also built in a way that extra modules could be added in the future. Besides the product itself, we created an integration module for each hospital, as they way data is treated and stored is nowhere the same due to historical reasons. I was responsible for the toolkit and patient portal, and also helped out on the other modules as much as possible.

Toolkit - This is a Fabricator based toolkit where we create all components and styling needed for the various web modules. We also took advantage of this to add documentation on why we chose certain stylings and behaviours for getting a user friendly UX, as the app would be used by a large group of different types of people.
Kiosk - This comes with a kiosk hardware and is used for helping patients sign in, giving them their ticket and route to their appointment. It’s built on top of spring webflow, using thymeleaf templates.
Patient Portal - A web application for patients to make appointments, see upcoming ones, check documents and update their data. Patients can log in with their eID.
Admin Portal - This module gives the hospital a way to customize the other parts of the product through settings, data management etc….

HTML5
Sass
Java
AngularJS
Fabricator Builder
IntelliJ IDEA

iKnow Application Prototyping

Role Medior UI/UX Web Application Engineer
Logs July 2015

We were asked to create some prototypes for an application that uses iKnow for data analysis. The main usage would be that there could be analysis on the doctors’ briefings to identify certain patterns and draw conclusions from it.

I created high-level UI/UX wireframes to show how hospitals could easily analyse the data by dynamic views that showed the context path, so different paths could be analyzed together.

Paint.NET
Confluence
PowerPoint

myHealthbox Prototyping

Role Junior UI/UX Web Application Engineer
Logs November 2014

During the first phase of our first own product, now known as myHealthbox, we had the need to prototype it, so we could review all de decisions made up until that point, and be able to still make changes on features and functional details, so that we would end up with a user friendly product.

We created a static website as prototype, so we could make changes very easy and fast and iterate over it quickly. It also was build quick and dirty as it was decided we wouldn’t take anything from this to start the actual product.

HTML5
Sass
Jade/Pug
Metalsmith
IntelliJ IDEA

Marketing Websites Prototyping

Role Junior UI/UX/FE Website Engineer
Logs October ... August 2014

As the one with the most experience on cms websites, I was assigned to work on prototypes for 3 new marketing websites, all to be created with the help of drupal, as that would give us the most customization options, and most importantly, being able to code changes and upgrades, in case something goes wrong, or for when we need to deploy different versions of them.

I worked on these alone, and had the freedom to also design a great deal of the websites, keeping in mind the given requirements. Before starting these, I had the chance to study PHP and get my certification.

HTML5
Sass
PHP
IntelliJ IDEA
Drupal

StudySteps

Role Junior UI/FE Web Application Engineer
Logs July ... May 2014

StudySteps is one of the online learning applications from Publisher VAN IN. It’s created to help high school students with math through many kind of exercises. It includes gamification concepts to stimulate using the app and let students having fun while learning. There is also an option to get a mentor, which can be contacted one 2 one to get personal help and reviews.

Besides the actual application, there is also a commercial website, created in dotcms, which was chosen for it’s language Java as most developers on the project knew it already. At the time I worked on the project, we didn’t got a great experience from it though, as it was not flexible enough. Being the one with the most experience in cms systems and theming/styling, I was asked to maintain and further develop the marketing site, in collaboration with the sales team of publisher VAN IN.

I came on the project when the decision was made to rewrite a great part of it in AngularJS. We had a 2 day course of the framework, as it was fairly new then, before starting on the rewrite. I mostly wrote on the custom components, including a customized ckeditor with custom plugins.

HTML5
Sass
AngularJS
IntelliJ IDEA
dotCMS

Bayer Cropscience Application

Role Junior UI/UX/FE Web Application Engineer
Logs February 2014 ... May 2013

Bayer was in need of an application to support its R&D work. two of the main requirements were the ability to handle very large data sets very well and have a web application which can be used on-site. When the application started, Silverlight was the prefered framework at Bayer to write web apps. It was also used because of how it can handle data tables very well in contrast to other web frameworks.

The application is built on the MVVM principle and is using the Telerik UI controls. Besides implementing the different xaml views and defining the application architecture, I also focussed on styling. Though I did came on the project very late in it’s lifecycle, there was still lots to refine.

C#
Silverlight
Telerik UI
Visual Studio

Thesis Software Engineer

Role Owner && Lead Software Engineer
Logs June 2013 ... September 2008

After finishing school as Master in Building Engineering, I worked some years for architects, doing mainly design and CAD Management. I still loved programming and kept doing that in my free time, but decided that I really wanted to learn all details of developing an application from begin to end, so I started to study again through evening school for Software Engineer.

We had the possibility to pick modules in different order and spread them out throughough the years, so that we could combine the study with our other daily activities. As of that time, I had a full-time job and did sport acrobatics in competition, which took 16 hours of training per week. So I opted to only do a few modules each year, taking longer than the average, but being able to combine all of this together.

For my thesis, I had chosen to write a web application for architects, as I did know that area pretty well. Silverlight was at that time a very good chose for the more heavy ones, as it did handle large data sets pretty well. I spent a lot of time with the analysis, and wrote up a bunch of storyboards before actually starting with development. These storyboards really show that I already was into UX, thinking about user-first and how to make up the UI in such a way that it would be very user friendly. Not only that, but also my analytic capabilities, seeing a good overview of what the application had to be and working all parts out step by step.

I really enjoyed doing my thesis, learned a lot from it and imho, a very good start for my career in UI/UX/FE Web Application Engineering.

C#
PHP
Silverlight
XAML
Visual Studio
Vectorworks