So how can we stay in touch during the Corona pandemic virus? Here are a few suggestions.
Author: Per Thykjaer Jensen
-
HTML – how to validate your code
The trade mark of the Multimedia Designer is a code with as few issues as possible. In the video you’ll get a short introduction to the debugging craft.
-
Research-WordPress.dk now on Multimusen.dk
Today I have moved the content from my research blog to Multimusen.dk
From 2016 – 2017 I was the lead WordPress researcher at the Business Academy Aarhus. Since the project “What You Should Know About WordPress” is not active any more I have decided to move all content from the research site to Multimusen.dk.
-
Psychedelic Art Experience
Tomorrow is the Question (Aros 2019)
This installation is fascinating. Like a charm or magic spell.
In the room streams of flowers will emerge from where you stand. Streams of what looks like water will flow around you. The psychedelic experience is hard to catch on photo.
Because it is multimedia: a magic universe of sound, interactions and projections.
The video by Aros below will give an impression. But you have to experience the installation. A video is not the same thing as being in the room.
Tomorrow is the Question is a User Experience. It is far more than a mereprojection on floors and walls.
I’d like to know how the installation was made. In the room before we entered the installation you could see some running computers with graphic cards. Whether they had something to do with the installation I don’t know.
We can only hope that Aros will get and show this installation on a permanent basis.
Read more about the exhibition here: https://www.aros.dk/besoeg-aros/udstillinger/2019/tomorrow-is-the-question/.
-
Rapid Prototyping by WordPress
Rapid Prototyping via WordPress
WordPress is one of your most powerful tools for UX / UI development in your toolbox.
Troy Dean demonstrates an Elementor workflow that you could use for a minimum viable prototype. The landing pages are made in black and white in order to eliminate design considereations such as colors. Of course you can do similar stuff with other page builders, including Gutenberg.
Video by Troy Dean: how to develop a rapid prototype with Elementor in WordPress.
Pros and Cons
- Pro: it is fast and easy. Via drag and drop you can create nice landing pages in a few minutes. You can transform your wireframes to a working prototype rapidly.
- Con: why not do the same thing in raw HTML / CSS? The editor should be able to save your posts and pages as templates. If not the creation of headers and footers on each landing page is not a permanent working solution.
Conclusion
From a UX point of view the black and white prototype will offer a rapid progress from say sketches and wireframes to a working prototype with focus on intended functionality.
If you want to conduct a UX-test on an intended landing page this method is excellent. But don’t confuse such pages with a finished template in a theme. The prototype is nothing but a nice looking draft.
Since the prototype is easy to make, test and change the method is convincing. If you don’t like Elementor and prefer something else – for instance the new Gutenberg editor – you can adapt Wpelevation’s idea. As long as you’re able to create a fast prototype.
If your editor is able to save such landing pages as templates – so much the better.
Designing the header and footer in a page builder is of cours possible. But is it a good idea? For prototyping probably yes. But in the actual production you’ll have to design a theme with a more permanent header / footer solution.
The next step
At the end of the day you can create fast and working prototypes in this manner. Of course a prototype is not the finished theme. After UX / UI tests the actual development of a theme would – with page templates for the landing pages – be the next logical step.
-
Sådan sætter du WordPress op på din localhost
Som webudvikler har man ofte brug for at kunne eksperimentere med sagerne i en sandkasse, hvor andre ikke har adgang. Her er en vejledning i at sætte WordPress op på din localhost – det vil sige en WordPress, der virker på netværket derhjemme.
Her er de vigtigste links fra disse tutorials:
- Mamp
- WordPress.org
- Installing WordPress (codex)
Læs mere om WordPress i min bog “WordPress in the Classroom” (2017). Her får du blandt andet historien om, hvordan WordPress themes har set ud gennem tiderne – og du kan lære mere om, hvordan man selv kan bygge et theme.
Opsætning af databasen i Windows
I videoen er password = root og bruger = root; men sådan er det ikke på et Windows system. Her er bruger = root og passwordet er en tom linje.NB: Denne tutorial er udviklet til et forløb på Multimediedesigneruddannelsen, hvor klasserne blandt andet lærer at sætte et WordPress-udviklingsmiljø op på en localhost.
-
Create a WordPress Sandbox on Your PC
How to install WordPress on your PC or Mac
When you develop a web site it is often more convenient to work on a local computer.
A) Install the Apache Server MAMP
B) Install WordPress on MAMP
Set up WordPress on localhost
In order to run WordPress needs a server environment with PHP and a MySQL database. Here you have several options. Whether you prefer one or the other does not matter much. Here are a few options, choose one of them:
- Windows: you may use something like MAMP or XAMPP
- Mac: use MAMP
Remember to a directory where you have writing permissions. See these recommendations. - Linux: go for a real LAMP stack, e.g. on Ubuntu try this LAMP solution.
After installing the localhost, you can install WordPress on your local machine. Follow these instructions. If you prefer to follow a video tutorial, here is one more:
Test content
Of course you could write a lot of test content, just to see how every HTML element, any image or whatever works. A better alternative is this: use the WordPress test unit. Here you download test pages, posts and images – and then you will be able to inspect whether everything works as it should.
The Theme Unit Test consist of a xml file with posts, pages, images and so on. You can import them via Tools > Import. You may have to add a plugin in order to import.
In fact this option is very practical. You can import and export content from a localhost to your online WordPress when everything is ready. But first you should try out some themes, and see how they behave with the test content.
In the menu section assign the test menu to the menu location. Now you are ready to see your theme in action.
Try out a few themes
As soon as you have the test content you might want to test a few themes. In the Dashboard go to Themes > Appearance and search for new themes. There are thousands of themes out there, so try to find something that looks like the design you want. In my opinion you should go for an open source theme. Not because it’s “free”, but because these themes have a code-base that’s more easy to change. Often the so-called professional themes have a horrible code, and it is meant to be so. If the user is not confused, how could they continue to sell more solutions?
A Few Useful Plugins
When you have found a good theme, you should add a few plugins. Whatever you choose is a matter of taste, but I’d recommend these as a starting point:
- Jetpack (performance, tweaks, speed and more)
- Akismet (fight spam)
- A page builder, like:
- Elementor
- Page Builder (Site Origin)
- Or just use the standard Gutenberg editor (it is better than most people think).
- For SEO
- Yoast
- The SEO Framework
- Security
- WP Limit Login Attempts
- Webshop
- WooCommerce (very popular solution)
There are thousands of plugins for galleries, portfolios, shops, images and so on.
Create Content
As soon as these things are done, you are ready to create the actual content. When we develop web solutions it is best practise to work with real content, rather than the boring Lorem Ipsum.
In order to avoid confusion do this:
- Delete the content from the Theme Unit Test
- Create real content:
- Pages for static content, such as “About Us”
- Posts for the blog posts
- Add widgets
Remember to use Categories and Tags. It will improve your SEO and give more power to your menus.
When you create the content, try you can try page builder!
Pagebuilding with Gutenberg
You should try out Gutenberg. It has many of the features, that you expect to find in Elementor and friends. WordPress’ new editor was not popular among developers when it was introduced.
The following tutorial is a fine introduction to Elementor by Adam Preiser. If you like the tutorial you can visit his tutorials on https://www.wpcrafter.com/ .
Pagebuilder: Elementor
Elementor is a pagebuilder plugin. You can drag and drop content elements where you want them. And if you have wireframes, you can imitate a basic wireframe in a few minutes.
From localhost to the Web
When your content is ready for production, you will have to export the content and the theme. The theme is separated from the content – that’s why you must do the export in two steps. But first you’ll have to install WordPress on a server.
Most web hotels have a “WordPress in one Click” option. Just create the WordPress site. Give it a name. And you’re ready to go. The next steps are:
- Install the theme (in the same way as you did on the local machine).
- Install all the plugins you want to use.
As soon as this is ready, you go to your local machine. Enter the Dashboard > Tools > Export – and export all content.
Now you go to your online version of WordPress and choose import. Remember to check the box with import media files. If you do so the local images will be copied to the online media library.
Now your site is online, and ready for whatever purposes you or your clients may have.
FAQ
Sometimes things work fine, but now and then we run into troubled waters. In this section I have listed some common problems, we see again and again in the multimedia classes.
Problem: you try to install a theme or a plugin, and get a prompt where you are asked to use FTP.
Solution: Check the folder permissions. Make sure, that the server has write and execute permissions in the folders.Problem: I get a database connection error during WordPress install on MAMP.
Solution: In MAMP the password and user is ‘root’.Problem: I get a database connection error on XAMPP.
Solution: On Windows the user is root and the password is blank. On Mac the user and password is root.Problem: XAMPP crashes.
Solution: Use MAMP … 😉In my experience XAMPP has a steep learning curve, and often errors occur out of the blue.
So if you work on either Mac or Windows I’d recommend MAMP.
-
Summer Hacks
A few hacks for the summer. Some of them are wicked
-
GDPR – and photographers
Data protection is a good thing, however there may be unpleasant surprises in the GDPR. Photos are data, that is personal data. So many photographers are worried – for instance: is street photography illegal from now on?
Here are two voices – a photographer and a business oriented approach to images.
A photographer’s concerns
Below you hear a photographers concerns. For instance can you take a group photo at a party? Actually such a heinous action may be a crime.
Marketing and photos
Below you’ll find a business oriented approach. It’s mostly about marketing and photos. So if you use Mailchimp or similar for marketing it is very relevant for marketers.
Perhaps even this blog post is an evil criminal offence. You see pictures here. Am I allowed to share the links? In some ways the GDPR has good intensions, however parts of the GDPR is lawyer BS.
For multimedia designers there are many concerns here:
- How about images from APIs such as Instagram, Twitter, Facebook, Pinterest?
- Will street photo be illegal in the EU?
- What are the consequences for street, event and similar photographers?
- Surveilance cameras?
At the moment certain countries use the GDPR as an excuse for censorship. Photographs of public spaces, such as monuments may be restricted. So what started as good intensions for data protection created monsters – as is often the case in legislation.
-
Ny studieordning på vej til Multimediedesignerne
Torsdag – fredag mødes ledere og undervisere på Multimediedesigneruddannelsen i Odense for at arbejde med den nye studieordning for uddannelsen.