Website Portfolio Update: Creating and Managing your Database

When creating a portfolio website, it would be such a hassle to create and design each page for different portfolios. The smart way to tackle this problem is to create one 'template' for your portfolio details, and inputting the content into a database. Adminer is a tool for managing content in MySQL databases. Primarily, Adminer allows you to manage the content of your website through a table-like database, where you can easily add, remove and change the subject matter.

Here you can see my Adminer database. It has two databases, one to represent the content for the portfolio details, and the other is for the gallery.

This is the porto_info database. It consists of the project id (code for each project), year, title, video (in the form of iframe), image_thumbnail (the same image used for the featured page and the main cover for the portfolio details), head1 and head2 (headings), desc1 and desc2 (description)

This is how the inside of the database looks. I fill in the information that I want to show, and accordingly 'pull' the information from this database to my website so each project id can dispense the correct information.

This database is a new database, where I just put in the images used for the gallery (the collection of pictures for each project). The project_id correlates directly with the id from the porto_info database. Then the image_name is just the images I want to include (be reminded that the spelling should be precise as it is case-sensitive).

The images you want to include in your portfolio should be inserted into FileZilla; a File-Transfer Protocol/FTP application, which allows clients to upload their website to the server. All codings should be inserted into the 'httpdocs' folder, this is THE folder that allows your coding to be uploaded to the server.

For me, I have a folder called assets where I input all my CSS and images (folder). Below, you can see that the images I uploaded to this folder are the same as the images I typed in the database. Another thing to remember is that make sure to compress the images you upload into FileZilla. This is because a website tends to load longer if the file size is big. It is recommended to have an image with size of under 1MB.

Comments

TouchDesigner Experiment: Inserting OSC data with OSCIn

From one of my last experiment , I tried to change the data input. Instead of using audio, I replaced it with OSC data from my Muse headset. To connect your OSC device to TouchDesigner, make sure that the IP address and port number is the same so the data transfer can be accurate. In this case, I use a third-party app called Mind Monitor (available on iOS devices) to connect my Muse headset to the TouchDesigner software. Below are screenshots and videos from my experiment. You can see that the brainwave data is already recorded in real-time in the software. Then I used the alpha, beta, and theta brainwave to change the movement of the visuals (the chosen brainwave data I used are just placeholders for now to see the movement). Then the data is connected with 'noise', which is like the fluid/abstract visuals you see on the background. I also set the colors to be moving/changing over time.

TouchDesigner Experiment: Audio Reactive Particle Cloud

My second experiment with TouchDesigner is creating this audio-reactive particle visual by following Bileam Tschepe 's tutorial on Youtube. Again, I just followed his tutorial step by step. This tutorial is a little different because it uses both audio and visuals. The visual follows the music in real-time. Other than audio, we are also introduced with the element 'Math' to add the channels of the audio together. This is the end product. Music is FriendsV2 by Muskatt.

Final Project Research - Final Proposal

This blog post will summarize the proposal for my final project. Translating Memories. A brainwave art installation. This project is based on a lot of things, but mainly from making art that is personal, unique, one-of-a-kind to the person involved in making it, because the art is created by their own personal memory. It will also allow people to express their feelings with the correspondent memory without having to say it out loud. The projected image will consist of abstract visual created by the combination of lines, shapes, and colors that follows the Geneva Emotion wheel . The Geneva Emotion wheel has been commonly known by psychologists to determine what human emotions are represented by what color and plotted on a 2D valence-activation graph. This project doesn't really have any particular target audience. Anyone and everyone are welcomed. Art enthusiast or just the curious mind. The value that I believe when creating this project is it is still uncommon to us...

˗ˏˋ ChristineDinata ˎˊ˗

Search This Blog