Showing posts with label graphics. Show all posts
Showing posts with label graphics. Show all posts

12/11/19

The Wednesday Evening Training: a recap of 2019 and quick preview of 2020

Also this year we organized around 50 sessions on diverse technical topics. We learned a lot and we had a lot of fun...



On 3D graphics... Quincy Jacos and Remko Haagsma organised a number of sessions covering various techniques in computer graphics like WebGL, Unity 3D, Blender and of course the math involved. We dealt with one topic per evening and had also have time to work on projects together or alone. At the end of 2019, we mainly discussed topics that were close to the basics. The sessions that have been held so far were about the layout of the track and the Unity game engine.

On Quantum Computing... Julian van Velzen organised sessions in which the basics of Quantum Computing were discussed: the physics, gates, programming and platforms (IBM, Microsoft) involved.

On architecture... Amir Westhoff, Fred van Nimwegen and Hans van Rijs discussed ways in which architecture can be modelled, stored & queried and visualized. Some of the topics: Neo4J (graph databases) and Apache Jena for storing and querying models, patterns, modelling in Archimate/Archi and UML and model visualization prototypes in threejs (2D/3D).

On IoT and Microcontrollers... Aishwarya Dhall organised sessions on Arduino, Raspberry Pi. In various labs we experimented with various sensors, made our own LED cube and learned to implement basic home automation solutions using IFTT (If This Then That) and Smart Home Devices like Alexia.

We discussed various topics on software engineering and specific technology stacks like C#, Python, Code Reviewing & SonarQube, ASP.NET Core, WebSockets and SignalR.

On mobile we had workshops on Android Studio, Ionic4 and Progressive Web Apps (PWA).

There was also room for Frontend technologies like Angular, Web Components, FlexBox and Vanilla Frontend Architectures (that is: building the frontend without frameworks).

On security, we had sessions on Encryption and Social Engineering in which we discovered that you don't need to use advanced technology to hack an organisation.

Various platforms were discussed, like Kafka, Docker, Kubernetes and DevonFW.

And in our "klusavonden" (which translates from Dutch as "an educational and sociable evening full of experiments on technology") we worked on our projects on various topics, gave demos and held discussed on the topics involved.

Thanks to all colleagues who contributed to the sessions by sharing their knowledge, experience, prototypes, demos and participating in the inspiring discussions!


There remains a lot to learn in our Wednesday Evening Training... a quick preview on 2020


In 2020, we'll continue our tracks on Graphics, IoT & Micro controllers, Architecture and our Combi klusavonden. And more topics have been put on the agenda... and there is still room for more.

The agenda for the sessions in January and February 2020 will include:

  • Combi IoT klusavond: Squat for coffee (Arduino and sensors)
  • Practical 3D Graphics & Programming: Practical 3D Graphics & Programming: Unity movement
  • A practical introduction to the Kotlin cross-platform programming language
  • A practical introduction to the ReactJS framework
  • Combi IoT klusavond: Automate your house using IFTTT.com (If-This-Then-That)
  • Practical 3D Graphics & Programming: Blender modeling
  • Architecture: API management


Past Wednesday Evening Trainings on all topics

You 'll find post of previous sessions on my blog and on LinkedIn: https://www.linkedin.com/search/results/content/?keywords=%23wednesdayeveningtraining


Would you like to attend one of our Wednesday Evening Training sessions?

There is a limited amount of seats available to attend our sessions. Please send me an email if you would like more information on the sessions and the the possibilities to attend.


Work @Capgemini?

Do you want to join us? We're always looking for and well-motivated young professionals. Do you have a bachelor or master degree or extensive practical experience? Or do you have a relevant ICT / Informatics training and you have become curious about us? Please send me an email. Working for us gives you access to all Wednesday Evening Trainings!

10/12/18

This week's Wednesday Evening Training: a "klusavond" on a giant Arduino driven LED cube, a lot of sensors and generating 3D Archimate models

In this week's Wednesday Evening Training we had some great demo's and discussions on our individual projects on IoT and 3D modelling.





A lot of IoT

Aish showed us her giant LED cube (10x10x10 LED's, that's a lot of soldering!) and explained to us how she managed to build and run it. We discussed powering such a large collection of LED's and how the software was designed. Such a bug LED cube offers plenty of applications, including running 3D animations and games within the cube. We've started building a graphics library for basic LED handling that is going to be a great help in building such applications.

Aish also showed us her multi sensor project; a test platform on which all sorts of sensors are installed. We discusses the various sensor types, how to connect and use them and how (combined) measurements can best be done. Interesting stuff! One of the topics we also discussed is the way which the sensors are read in the software. That can be done in a loop but also using interrupts (low level event handlers). The latter method is faster, less error prone and cleaner. We'll be investigating this technique in the upcoming Wednesday Evening Training IoT sessions.







Archimate architecture models in BabylonJS 3D

This week's session, I gave give a demo of my BabylonJS prototype in which an Archimate model view (using the free Archi editor) is converted into a BabylonJS 3D model. For complex architectures, 3D modelling may give more insight than plain 2D models. Worth doing some experiments to see whether this is a good approach. The Technical Proof of Concept is running great. It uses MySQL as a central database and a simple website with some Web Workers to gather model data, generating and continuously updating a JavaScript Archimate model and a derived Babylon 3D model from this in the background. Our colleague Fred van Nimwegen also joined my project and he had experimented with Neo4j in which he stored the Archimate model.  Neo4j is a graph database (while MySQL is a relational database). Graph databases have some advantages over relational databases, mainly when querying data collections that naturally resemble networks. And that is exactly what an architectural model resembles: a network of related nodes. Moreover: modern architectures are getting more dynamic and will change over time more rapidly. When analyzing an architecture model to answer architectural questions like "what will happen when I change this?", an efficient query language and dito database are very convenient. We've planned a Wednesday Evening Training session on Graph databases and Neo4j in november. Fred will then share his knowledge gained with us.





Further reading

Do you want to read more on the topics in this post? Here are some links…

Considering building your own LED cube? Start simple with a 4x4x4 cube (still 64 LEDS, but at least you won't be needing a nuclear plant to power it): https://www.instructables.com/id/4x4x4-LED-Cube-Arduino-Uno/
BabylonJS: https://www.babylonjs.com
Archi: https://www.archimatetool.com
Archimate tool database plugin: https://github.com/archi-contribs/database-plugin
Neo4j: https://en.wikipedia.org/wiki/Neo4j


Past Wednesday Evening Trainings

You 'll find post of previous sessions here: https://www.linkedin.com/search/results/content/?keywords=%23wednesdayeveningtraining


Next week 's Wednesday Evening Training

Next week, we'll have the intro on Progressive Web Apps (PWA)This a hot topic in the world of web development and its only growing further in popularity. It is a relatively new way to develop applications for the mobile phone, combining the best of the web and apps. We will cover benefits using a PWA instead of traditional hybrid/native solutions, the basics and possibilities of a PWA, show some examples in functionality and give an example of how you can get started building your own PWA’s quickly. Yes, there will also be a handson lab. In later sessions we expect to cover topics like push notifications, background refresh, et cetera. 

9/30/18

This week's Wednesday Evening Training: Taking a deep dive in WebGL coloring and continuing our BabylonJS labs

In this week's Wednesday Evening Training we continued our exploration of WebGL and BabylonJS.


A deep dive into coloring in WebGL and continuing our BabylonJS labs

Quincy Jacobs took us on a deep dive into WebGL and showed us how to add color to objects. Combining the Color and Position Vertex Buffers involves quite a bit of math. In order to polish up our mathematics in that area, we have planned a refresher hour for the Wednesday Evening Training on WebGL (that will be October 10th) . We also took plenty of time for our BabylonJS labs. Based on the labs we did last week, we experimented with diffferent camera's, light sources and materials. We also experimented with parent and child objects and did a bit of animation. More of that also on October 10th, then I'll give a demo of my BabylonJS prototype in which an Archimate model view (using the free Archi editor) is converted into a BabylonJS 3D model. For complex architectures, 3D modelling may give more insight than plain 2D models. Worth doing some experiments to see whether this is a good approach!


Further reading

Do you want to read more on the topics in this post? Here are some links…

Quincy's WebGL explanations and examples on GitHub: https://github.com/QuincyJacobs/WebGLTutorial
Building up a basic demo with Babylon.js: https://developer.mozilla.org/en-US/docs/Games/Techniques/3D_on_the_web/Building_up_a_basic_demo_with_Babylon.js
A practical intro to BabylonJS (presentation): https://www.slideshare.net/HansRontheWeb/a-practical-intro-to-babylonjs-115869611

See also the BabylonJS links in my previous posts in the Wednesday Evening Training.

Past Wednesday Evening Trainings

You 'll find post of previous sessions here: https://www.linkedin.com/search/results/content/?keywords=%23wednesdayeveningtraining

Next week 's Wednesday Evening Training

Next week 's Wednesday Evening Training In next week's Wednesday Evening Training, one of our security experts, Vince Corona, will give us some more examples of hacking and explain us the importance of security in ICT. In the previous session, we already had a great intro on security in which he explained and demoed some basic hacking scenario's.
This evening on october 3rd is also open for visitors! The location is our main office in Leidscherijn, Utrecht (The Netherlands). You can subscribe at the following URL: https://www.werkenbijcapgemini.nl/events/How-to-become-a-hacker

In the future, more of the Wednesday Evening Trainings will be opened for visitors. Make sure that you follow the #wednesdayeveningtraining on LinkedIn or my Blog.

9/22/18

This week's Wednesday Evening Training: Introduction to WebGL, BabylonJS and 3d/game engines

In this session, we continued our exploration of 3D modeling and animation with a deep dive into WebGL and BabylonJS. Quincy Jacobs and I gave explanation on the basic concepts and illustrated these with code walkthroughs of WebGL and BabylonJS examples. The class could also gain some experience with two handson labs in which graphics and animations were implemented.



WebGL 

WebGL (Web Graphics Library) is a JavaScript API for rendering interactive 2D and 3D graphics within any compatible web browser without the use of plug-ins. WebGL is integrated completely into all the web standards of the browser, allowing GPU-accelerated usage of physics and image processing and effects as part of the web page canvas.

In the WebGL part, Quincy explained us the Graphics pipeline that is used to draw graphics. The concepts of a Vertex array buffer, Element array buffer, Vertex shader, Fragment shader and a Shader program have all been explained and illustrated based on a code example in which a triangle object was drawn on the screen. An effective way of really getting to know technology. There is a lot of math involved, so we also needed some recap of stuff we learned a long time ago :).

Quincy has published his WebGL explanations and examples on his GitHub site: https://github.com/QuincyJacobs/WebGLTutorial



BabylonJS

This is complete JavaScript framework for building 3D games and experiences with HTML5, WebGL, WebVR and Web Audio (https://www.babylonjs.com). It's based on WegGL, so if you understand the nuts and bolts of WebGL, it increases understanding of BabylonJS.

First I explained the basic concepts of BabylonJS. Basically, a BabylonJS application consists of a webpage in which a canvas element (just an HTML tag) is used for drawing a model into. The model is a scene in which model objects are defined, a camera is positioned, a light source is added (since it's rather difficult to see your objects in the dark) and a "render loop" is added to continously update the model. In the render loop you can add interactivity. Well, that's a BabylonJS application in a nutshell, in reality this can be a bit more complicated.

Based on the handson lab provided by Mozilla (see resources), we did a code walkthrough of the lab code in which the concepts were explained more thoroughly. The basic objects (called "meshes", like cubes, spheres, etc.) were discussed, but also self-defined objects. This last category can be composed on the basis of vectors. We went into the use of light; different light sources and their effect on the display of objects. In addition, animations were discussed and the way in which this can best be implemented in a BabylonJS application.
We also paid attention to more advanced topics like performance optimization (necessary because a lot of calculation work is involved, especially when implementing animation) and tooling. Using Blender, for example, you can create 3D objects that you can import easily in your BabylonJS scene. 

I've published my intro on SlideShare, you'll find the link in the resources section below. Game engines Also, we did a very quick overview on the architecture of (online, multi user) gaming engines. This is a fairly extensive subject for which we will certainly need more time. We will therefore take that time in the coming months.


Further reading

Do you want to read more on the topics in this post? Here are some links…

Quincy's WebGL explanations and examples on GitHub: https://github.com/QuincyJacobs/WebGLTutorial
Building up a basic demo with Babylon.js: https://developer.mozilla.org/en-US/docs/Games/Techniques/3D_on_the_web/Building_up_a_basic_demo_with_Babylon.js
A practical intro to BabylonJS (presentation): https://www.slideshare.net/HansRontheWeb/a-practical-intro-to-babylonjs-115869611

See also the BabylonJS links in my previous posts in the Wednesday Evening Training.


Past Wednesday Evening Trainings

You 'll find post of previous sessions here: https://www.linkedin.com/search/results/content/?keywords=%23wednesdayeveningtraining

Next week 's Wednesday Evening Training

In next week's Wednesday Evening Training, we will continue on WebGL and BabylonJS. We have some additional topics to discuss and some extra labs to play with. I'll also give a demo and explanation on my Archimate 3D model generator. This is my pet project that I've been busy with the past months. It's not finished yet, but it's a nice example of a basic multi user BabylonJS model generator combined with a primitive multi player game engine.

Also worth mentioning is the Wednesday Evening Training of october 3rd. That evening, one of our security experts, Vince Corona, will give us some more examples of hacking and explain us the importance of security in ICT. In the previous session, we already had a great intro on security in which he explained and demoed some basic hacking scenario's.

This evening on october 3rd is also open for visitors! The location is our main office in Leidscherijn, Utrecht (The Netherlands). You can subscribe at the following URL: https://www.werkenbijcapgemini.nl/events/How-to-become-a-hacker

In the future, more of the Wednesday Evening Trainings will be opened for visitors. Make sure that you follow the #wednesdayeveningtraining on LinkedIn or my Blog.

#capgemini, #wednesdayeveningtraining, #lifeatcapgemini, #workatcapgemini #webgl, #babylonjs, #3d, #graphics, #animation