25. August 2022

KAIAKOO® Bildungsgruppe

Custom multisite setup for an educational institution website.

„The KAIAKOO® education group is a recognized education provider based in Speyer. Our services are tested, certified and eligible for funding in accordance with the Accreditation and Licensing Ordinance (AZAV). Our consulting cosmos includes in particular the topics of PROFESSION, CAREER & FOUNDING.“

WordPress Multisite Backend (3 websites)
Custom website design, all designed in house.
Theme core based on Elementor, so that the customer can do as many tweaks as possible himself.
Custom plugin for internal functionality.
Custom plugin to autofill PDFs, based on PDFTK. Its used to prefill official & internal documents, easing the daily workflow. More areas will be included in the future.
Feedback solution for customers.
Linked data across multisite.
Analytics
SEO
New server setup, server / email move & maintenance

KAIAKOO – Bildungsträger & Persönlichkeits-Architektur

25. Mai 2022

Nacht der Sterne 2022 – TYPEMYKNIFE®

Ich hatte dieses Jahr die Möglichkeit, über meinen Kunden TYPEMYKNIFE®, an der „Nacht der Sterne“ in Stuttgart, im Mercedes-Benz Museum, teilzunehmen. Auf der Gala kommen mehr als 800 Gäste aus Gastronomie, Hotellerie, Politik, Kultur und Wirtschaft zusammen.

NACHT DER STERNE / ahgz Sterne Award 2022

portalZINE NMN | Development meets Creativity | nacht der sterne 2022 typemyknife 1 — Felicitas Then – Anmoderation

portalZINE NMN | Development meets Creativity | nacht der sterne 2022 typemyknife 3 — Verleihung + Food

Es war ein klasse Abend, auf dem nicht nur die Spitzenköche aus Deutschland, der Schweiz, Südtirol und Österreich ausgezeichnet wurden, sondern diese auch Live zeigen konnten was sie so können.

Veranstaltet wird die Party von der Allgemeinen Hotel- und Gastronomie-Zeitung (Ahgz) und Burg Staufeneck / Rolf Straubinger.

Moderatorin des Abends waren die Journalistin und Fernsehköchin Felicitas Then und Rolf Westermann von der ahgz-Chefredaktion.

Informationen zum Award, den Methoden und Siegern findet man hier.

TYPEMYKNIFE®

TYPEMYKNIFE® hat Vorort an einem Stand eine kleine Auswahl seiner Küchenmesser, die über den 3D Gravur Konfigurator vorbereitet und graviert wurden, präsentiert. Dadurch hatten Gäste die Möglichkeit, die gravierten Küchenmesser einmal persönlich zu entdecken und die Qualität zu bestaunen.

portalZINE NMN | Development meets Creativity | typemyknife portalzine — Glamour Shot / Kartentausch LOL

Die fast 1400 km Rundreise aus dem Norden hat sich gelohnt. Es ist immer schön Kunden mal nicht nur virtuell zu treffen, besonders wenn die Distanz so groß ist. Bei der Entfernung trifft man sich nicht immer mal kurz auf einen Kaffee oder Gin-Tonic :)

Gruß an TYPEMYKNIFE® / Schwäbisch Gmünd / Stuttgart

30. Januar 2022

Visual House | 3D Visualisierung – 2022

„Visual House erstellt realistische 3D Video-Animationen, Panoramatouren, Außen- und Innen Ansichten für Ihr Bauvorhaben.“

„Visual House creates realistic 3D video animations, panorama tours, exterior and interior views for your construction project.“

This is a simple portfolio website, that will be expanded upon in the future. The client wants to edit and maintain the website himself. Its a clean and simple layout with an Elementor Pro backend. Virtual panoramic tours are a key service they offer and is integrated directly for potential customers to explore. More to come in the future …

Update 2022: Update to a complete portfolio website, detailing the current portfolio and show-casing current services. Complete design revamp and custom template.

visual-haus.de

25. Januar 2022

3D Messer Gravur Konfigurator – TYPEMYKNIFE® | 2022

TYPEMYKNIFE® – allows you to laser ingrave your knife using a unique 3D configurator.

I redesigned their 3D knife configurator and helped to optimise the overall integration. The core backend functionality of the configurator was not created by me, I only helped debug and tweak the old & new functionality.

Complete redesign of the old 3D knife configurator
Prototype / Preview using Adobe XD
New help system, showing the user how to design their knife quickly.
Multi-language integration
Server tweaks for better sharing capabilities
Shop integration changes
Debugging for desktop / tablet & mobile integration
Performance boost & tweaks
Streamlined website integration

TYPEMYKNIFE / 3D KNIFE CONFIGURATOR / Example with knife loaded / Search for a knife

13. November 2021

Display Calibration / Spyder / Mac M1

Why?

Color correction is important to me and to the projects I do. Regularly calibrating your monitor is essential in order to create prints that accurately represents what you see on your monitor.

I have color-profiles (ICC – International Color Consortium) for different light conditions and I do recalibrate every few months, as the light output and colors degrade on my displays.

Spyder3

I am still using an old Spyder3 from datacolor for calibration, which is not really supported anymore. Hard to find working software for my Windows 10 machines and Mac M1.

DisplayCAL

To the rescue comes DisplayCAL, an Open Source calibration solution that allows you to calibrate your displays using even older calibration hardware.

DisplayCAL

ArgyllCMS – is an ICC compatible color management system, available as Open Source. This is requested by DisplayCAL to make the magic work. ( MAC M1 – Fork)

I have calibrated all machines with this and love it :)

1. November 2021

Hosting MP3 files on Google Drive + HTML5 Audio Player

What Google Drive Sharing offers us!

I am doing a Podcast on portalZINE.TV since last year and always host a backup of the MP3 episodes on Google Drive.

The link that you create, when enabling file sharing on Google Drive, can not be used to actually embed it on your website.

The link looks something like that:

https://drive.google.com/file/d/78BygKccgGms9ET2lUM0RPVUI1T0U/view?usp=sharing

1	https://drive.google.com/file/d/78BygKccgGms9ET2lUM0RPVUI1T0U/view?usp=sharing

To actually use it directly, we need to get the ID. Sure, you could just extract the ID, but often we just want to copy and paste. The sharing link is also your actual reference to the original file, which I store together with the podcast.

Apply a simple RegEX

We use a simple Regex to extract the ID:

https://drive.google.com/file/d/([a-zA-Z0-9_]+)\/

1	https://drive.google.com/file/d/([a-zA-Z0-9_]+)\/

PHP

$input = "https://drive.google.com/file/d/78BygKccgGms9ET2lUM0RPVUI1T0U/view?usp=sharing";

preg_match("/https:\/\/drive.google.com\/file\/d\/([a-zA-Z0-9_]+)\//", $input, $match);

$GoogleDriveFileID = $match[1];

$input = "https://drive.google.com/file/d/78BygKccgGms9ET2lUM0RPVUI1T0U/view?usp=sharing";

preg_match("/https:\/\/drive.google.com\/file\/d\/([a-zA-Z0-9_]+)\//", $input, $match);

$GoogleDriveFileID = $match[1];

JAVASCRIPT

var input = "https://drive.google.com/file/d/78BygKccgGms9ET2lUM0RPVUI1T0U/view?usp=sharing";

var res = input.match(/https:\/\/drive.google.com\/file\/d\/([a-zA-Z0-9_]+)\//)

var googleDriveFileID = res[1];

var input = "https://drive.google.com/file/d/78BygKccgGms9ET2lUM0RPVUI1T0U/view?usp=sharing";

var res = input.match(/https:\/\/drive.google.com\/file\/d\/([a-zA-Z0-9_]+)\//)

var googleDriveFileID = res[1];

Just use it!

This ID can than be used to embed the file directly using HTML5 audio controls.

Its important to use the „https://docs.google.com/uc?export=open&id=“ url to open the file, as it provides the direct access to the shared file

 <audio controls>
 <source src="https://docs.google.com/uc?export=open&id=<?php echo $GoogleDriveFileID; ?>" type="audio/mp3">
<p>This browser does not support HTML5 audio</p>
 </audio>

<source src="https://docs.google.com/uc?export=open&id=<?php echo $GoogleDriveFileID; ?>" type="audio/mp3">

<p>This browser does not support HTML5 audio</p>

</audio>

31. Oktober 2021

Importing CSV files with HTML5 and Papa Parse!

PAPA PARSE

Papa Parse is a powerful, in-browser CSV parser for the big boys and girls :)
If you do need easy CSV parsing and conversion back to CSV, take a look at it!

// Parse CSV string
var data = Papa.parse(csv);

// Convert back to CSV
var csv = Papa.unparse(data);

// Parse local CSV file
Papa.parse(file, {
	complete: function(results) {
		console.log("Finished:", results.data);
	}
});

// Stream big file in worker thread
Papa.parse(bigFile, {
	worker: true,
	step: function(results) {
		console.log("Row:", results.data);
	}
});

// Parse CSV string

var data = Papa.parse(csv);

// Convert back to CSV

var csv = Papa.unparse(data);

// Parse local CSV file

Papa.parse(file, {

complete: function(results) {

console.log("Finished:", results.data);

}

});

// Stream big file in worker thread

Papa.parse(bigFile, {

worker: true,

step: function(results) {

console.log("Row:", results.data);

}

});

SIMPLE TESTDRIVE

 <input type="file" name="File Upload" id="txtFileUpload" accept=".csv" />

1	<input type="file" name="File Upload" id="txtFileUpload" accept=".csv" />

document.getElementById('txtFileUpload').addEventListener('change', upload, false);

 function upload(evt) {
  
	var data = null;
	var file = evt.target.files[0];
	var reader = new FileReader();
	reader.readAsText(file);
	reader.onload = function(event) {
		var csvData = event.target.result;
		
		 var data = Papa.parse(csvData, {header : true});
		
		console.log(data);
		
	};
	reader.onerror = function() {
		alert('Unable to read ' + file.fileName);
	};

}

document.getElementById('txtFileUpload').addEventListener('change', upload, false);

function upload(evt) {

var data = null;

var file = evt.target.files[0];

var reader = new FileReader();

reader.readAsText(file);

reader.onload = function(event) {

var csvData = event.target.result;

var data = Papa.parse(csvData, {header : true});

console.log(data);

};

reader.onerror = function() {

alert('Unable to read ' + file.fileName);

};

}

ABOUT

Papa Parse is the fastest in-browser CSV (or delimited text) parser for JavaScript. It is reliable and correct according to RFC 4180, and it comes with these features:

Easy to use
Parse CSV files directly (local or over the network)
Fast mode
Stream large files (even via HTTP)
Reverse parsing (converts JSON to CSV)
Auto-detect delimiter
Worker threads to keep your web page reactive
Header row support
Pause, resume, abort
Can convert numbers and booleans to their types
Optional jQuery integration to get files from <input type="file"> elements
One of the only parsers that correctly handles line-breaks and quotations

USAGE

I am currently using it to quickly parse Adobe Audition CSV marker files and prepare them for storage for my podcast.

Name	Start	Duration	Time Format	Type	Description
Ankündigungen	0:20.432	0:00.000	decimal	Cue	
Stargate Table Read	1:12.811	0:00.000	decimal	Cue	
Dune Part One 2021	1:58.677	0:00.000	decimal	Cue	
Dust - Cosmo	2:20.925	0:00.000	decimal	Cue	
Nina - Beyond Memory	2:51.276	0:00.000	decimal	Cue

Name Start Duration Time Format Type Description

Ankündigungen 0:20.432 0:00.000 decimal Cue

Stargate Table Read 1:12.811 0:00.000 decimal Cue

Dune Part One 2021 1:58.677 0:00.000 decimal Cue

Dust - Cosmo 2:20.925 0:00.000 decimal Cue

Nina - Beyond Memory 2:51.276 0:00.000 decimal Cue

Papa.unparse(tabData, {	
	delimiter: "\tab",
	header: true,
	newline: "\r\n",
	skipEmptyLines: true
})

Papa.unparse(tabData, {

delimiter: "\tab",

header: true,

newline: "\r\n",

skipEmptyLines: true

})

Papa Parse @ GitHUB

Homepage / Demo

18. Oktober 2021

5 auf einen Streich – Folge 104

Die erste Folge nach einer langen Pause ;)

Folge 104

17. Oktober 2021

Podcast – 5 auf einen Streich

UMZUG

Moin! Im Juni hatte ich den Umbau von portalZINE TV angekündigt und kündige jetzt den Umzug des Podcasts – 5 auf einen Streich – an.

5 auf einen Streich findet man jetzt hier.

Durch die Themen werde ich weiterhin rotieren, aber den Fokus stärker auf Entwicklung & Design setzen.

Mal sehen, wie sich das so entwickelt :) Die erste Folge für 2021 folgt bald …

ARCHIV

Damit ist portalZINE TV jetzt ein reines Archiv.

Gruß
Alex

1. Oktober 2021

TYPEMYKNIFE® – We Type Your Knife | 2021

TYPEMYKNIFE® – allows you to laser engrave your knife using a unique 3D configurator.

Their shop provides a vast amount of knives from different known knife manufactures (Burgvogel, Chambriard, Claude Dozorme, DICK, Giesser, Güde …), while also offering their own (TYPEMYKNIFE® Messermanufaktur).

Founders / Company
Claus Ermlich & Thomas Raschke GbR

Status
It has been a pleasure to work with these guys so far and looking forward to the shop + configurator taking off. The website is currently targeting the german market first, with more countries following in the future.

Launch
The website & shop went live on 1st of october 2021.

Consulting
WPML – multilingual integration, custom wordpress plugin for additional customer specific needs
Design tweaks & fixes
WooCommerce tweaks & fixes + German Market
SEO tweaks & fixes
Responsive cleanup
DSGVO integration tweaks
Server move, configuration & optimisation
Youtube API integration for video sync
Maintenance

TYPEMYKNIFE® / Shop / About / Blog / Youtube