diff --git a/content/ss24/bachelor/b2-makesign/_index.md b/content/ss24/bachelor/b2-makesign/_index.md index 9638d196..0258ee5e 100644 --- a/content/ss24/bachelor/b2-makesign/_index.md +++ b/content/ss24/bachelor/b2-makesign/_index.md @@ -1,7 +1,7 @@ +++ project_id = "B2" -title = "Makesign" +title = "MakeSign" subtitle = "Digital Signage for the IDiA Makerspace" claim = "A digital signage solution to promote events, projects, and schedules, simply and conveniently" @@ -20,20 +20,15 @@ study_focus = ['Web Technology'] {{
}} -If you have an event or project you want to share or invite people to, the current method is to elaborately and painstakingly hang posters throughout the campus. This problem has also plagued [IDiA](https://entrepreneurship.htw-berlin.de/ueber-uns/ideas-in-action-idia/ueber-idia/) in the past. In collaboration with IDiA, our project aims to digitize this process by using old monitors and TVs as digital signage boards that can be placed throughout the campus to display information in real-time, enabling the university to repurpose its old hardware. For the end-users, we offer a simple web application through which users can upload their content to the screens across campus. -We have developed a system for the IDiA [Makerspace](https://entrepreneurship.htw-berlin.de/ueber-uns/ideas-in-action-idia/idia-spaces/maker-space/), to graphically display the booking system for the machines in Makerspace, such as the 3D Printers and the CNC routers. This system allows the booking schedule of these machines to be reviewed by the students at the Makerspace in real-time on digital signage boards. -{{
}} - - -{{
}} - -The technology offers numerous expansion possibilities. For example, monitors could be put up as digital signage boards across the campus on varios high traffic spots and the system could be opened up to allow students and professors to upload their project or event posters. Another potential expansion would be to integrate the BVGs Api and to display tram arrival and departure times in real-time across different areas of the campus. -The possibilities for our project are limited only by the users' creativity in generating content for the screens. We aim to help IDiA and their Makerspace more effectively promote their events and provide a user-friendly system that allows for easy expansion. In the future, we hope to increase university students' awareness of campus offerings, thereby encouraging greater participation in projects and events, whether organized by IDiA, other students, or professors. +In collaboration with [IDiA](https://entrepreneurship.htw-berlin.de/ueber-uns/ideas-in-action-idia/ueber-idia/), we developed a project that aims to create a digital signage solution for the [Makerspace](https://entrepreneurship.htw-berlin.de/ueber-uns/ideas-in-action-idia/idia-spaces/maker-space/). +MakeSign will be used to display adverts and reservations for tools. +Key features include a well-structured dashboard for displaying time slots of 3D printers, laser cutters and CNC machines, as well as a system for uploading images to be displayed on monitors using micro computers. {{
}} + {{}} {{}} {{}} diff --git a/content/ss24/bachelor/b2-makesign/bootstrap.png b/content/ss24/bachelor/b2-makesign/bootstrap.png new file mode 100644 index 00000000..553a37a8 Binary files /dev/null and b/content/ss24/bachelor/b2-makesign/bootstrap.png differ diff --git a/content/ss24/bachelor/b2-makesign/css.png b/content/ss24/bachelor/b2-makesign/css.png new file mode 100644 index 00000000..d09c4f84 Binary files /dev/null and b/content/ss24/bachelor/b2-makesign/css.png differ diff --git a/content/ss24/bachelor/b2-makesign/discord.png b/content/ss24/bachelor/b2-makesign/discord.png new file mode 100644 index 00000000..e9dc50d7 Binary files /dev/null and b/content/ss24/bachelor/b2-makesign/discord.png differ diff --git a/content/ss24/bachelor/b2-makesign/docker.png b/content/ss24/bachelor/b2-makesign/docker.png new file mode 100644 index 00000000..9dcba0f2 Binary files /dev/null and b/content/ss24/bachelor/b2-makesign/docker.png differ diff --git a/content/ss24/bachelor/b2-makesign/features.md b/content/ss24/bachelor/b2-makesign/features.md index 9aa6c815..799f945c 100644 --- a/content/ss24/bachelor/b2-makesign/features.md +++ b/content/ss24/bachelor/b2-makesign/features.md @@ -1,11 +1,16 @@ +++ title = "Features" -weight = 20 +weight = 1 + draft = true + +++ {{
}} - +Using Makesign, you can project your own pictures, posters and GIFs on a screen and manage your content with an easy-to-use interface at any time. +Create slideshows, choosing how long each of the images are being displayed. +For dynamic displays, such as the dashboard, where you can see what tool is booked for how long, you can simply create a website and connect it with the system. +The projection runs via a Raspberry Pi, which means you can connect them to basically any screen you have lying around and give them a new life. {{
}} diff --git a/content/ss24/bachelor/b2-makesign/figma.png b/content/ss24/bachelor/b2-makesign/figma.png new file mode 100644 index 00000000..5e616d16 Binary files /dev/null and b/content/ss24/bachelor/b2-makesign/figma.png differ diff --git a/content/ss24/bachelor/b2-makesign/github.png b/content/ss24/bachelor/b2-makesign/github.png new file mode 100644 index 00000000..1a3571d2 Binary files /dev/null and b/content/ss24/bachelor/b2-makesign/github.png differ diff --git a/content/ss24/bachelor/b2-makesign/googledocs.png b/content/ss24/bachelor/b2-makesign/googledocs.png new file mode 100644 index 00000000..90b9202c Binary files /dev/null and b/content/ss24/bachelor/b2-makesign/googledocs.png differ diff --git a/content/ss24/bachelor/b2-makesign/js.png b/content/ss24/bachelor/b2-makesign/js.png new file mode 100644 index 00000000..e0bfa668 Binary files /dev/null and b/content/ss24/bachelor/b2-makesign/js.png differ diff --git a/content/ss24/bachelor/b2-makesign/process.md b/content/ss24/bachelor/b2-makesign/process.md index 73a2fa7d..3ca4980c 100644 --- a/content/ss24/bachelor/b2-makesign/process.md +++ b/content/ss24/bachelor/b2-makesign/process.md @@ -1,10 +1,20 @@ +++ title = "Process" -weight = 10 +weight = 1 + draft = true +++ {{
}} +At the beginning of the project, we had a kick-off meeting with Prof. Dr. Barne, our project supervisor, and Martin Holzhauer, our lead connection to the IDiA Makerspace. Martin explained his needs for the digital signage, which considers showing ads for the Makerspace and most importantly, the booking reservations of the IDiA booking website. +To get a general idea on digital signage, we looked around the campus for already existing digital signage use cases for inspiration, as well as possible cases, in which it might be practical to implement. After that, we looked at the IDiA booking website and selected the most important information necessary for the viewers to see on a separate “dashboard”. In addition, each of us sketched wireframes to find the necessary functions and the designs we needed. We researched which hardware, software, and frameworks we could use for the implementation. +For the hardware, Martin already used a Raspberry Pi for his prototype digital signage version, which simply cycled through some pictures of IDiA ads. A Raspberry Pi is a minicomputer, with a Linux based operating system, a small build, and that is pretty affordable, which makes it a practical use case for our project. The Raspberry Pi’s performance was sufficient for our needs. After talking with experts in the matter, we settled on the “Raspberry Pi 3 Model B+”, being the most practical for our project, and borrowed 3 Raspberry Pis on the spot. +At first, we divided up the team into 3 parts, with each working on a general task. The first, worked on setting up the operating system of the Raspberry Pi. The second, worked on the overall designs for the dashboard to get a feeling for Martin on how it will look like, as well as a smooth implementation on HTML/CSS/JS. The third, worked on finding a way to connect to the API of the IDiA booking website. +We managed to run Linux on the Raspberry Pis relatively quickly, but had problems connecting them to the universities' internet, Eduroam, as well as getting them past the HTW-Firewall to work remotely on our notebooks. For the API, we had to write some E-Mails back and forth to the corresponding developer of the IDiA booking website, until we received our very own API-Key to fetch data from the booking website and convert them to JSON objects and display them on the dashboard. +As we finished up the internet connection of the Raspberry Pis, as well as finishing up the dashboard with HTML/CSS/JS, the corresponding teams moved on to researching open-source software solutions, to change the contents on the digital signage. We came across a software called [Concerto](https://www.concerto-signage.org/overview), which would be able to handle all our necessities for the software. Multiple problems occurred, as we dove more deeply into the software. Concerto is fully written in the programming language Ruby and the framework Rails, which we collectively had no experience with. Furthermore, the last update was 7 years ago, which is why the UI and Code were not only extremely outdated but also did not work properly due to the changes to the Framework. So it was our task to update and improve Concerto. +Our supervisor supported us in this process, as it was difficult to improve the code without much "Ruby on Rails" knowledge. We struggled with this for a long time and had weekly meetings with our supervisor. +In the following weeks, we were able to configure our Raspberry Pi, so that it could automatically run and project a website on a monitor. Additionally, we finished up the dashboard connecting our design with the API via a server. +In the last weeks of the project, we sadly had to decide against further fixing Concerto and use the knowledge we gained from the process to set up our own rails application which fulfills the tasks we defined at the beginning. Our last job was to set up a web server with "Docker" to host the website, in which the user can upload the files they want to display. {{
}} diff --git a/content/ss24/bachelor/b2-makesign/rails.png b/content/ss24/bachelor/b2-makesign/rails.png new file mode 100644 index 00000000..13f715b1 Binary files /dev/null and b/content/ss24/bachelor/b2-makesign/rails.png differ diff --git a/content/ss24/bachelor/b2-makesign/shell.png b/content/ss24/bachelor/b2-makesign/shell.png new file mode 100644 index 00000000..23ab55f7 Binary files /dev/null and b/content/ss24/bachelor/b2-makesign/shell.png differ diff --git a/content/ss24/bachelor/b2-makesign/signal.png b/content/ss24/bachelor/b2-makesign/signal.png new file mode 100644 index 00000000..add3aea6 Binary files /dev/null and b/content/ss24/bachelor/b2-makesign/signal.png differ diff --git a/content/ss24/bachelor/b2-makesign/techstack.md b/content/ss24/bachelor/b2-makesign/techstack.md index e628eda1..1c4c1231 100644 --- a/content/ss24/bachelor/b2-makesign/techstack.md +++ b/content/ss24/bachelor/b2-makesign/techstack.md @@ -1,19 +1,47 @@ +++ title = "Tech Stack" -weight = 30 +weight = 1 + draft = true -hasMermaid = true +++ - -{{
}} - +{{
}} +{{}} +{{Zoom-Logo}} +{{Whatsapp-Logo}} +{{Signal-Logo}} +{{Discord-Logo}} +{{}} {{
}} +{{
}} +{{}} +{{Github-Logo}} +{{Google-Docs-Logo}} +{{}} +{{
}} -{{
}} - - +{{
}} +{{}} +{{Bootstrap-Logo}} +{{Javascript-Logo}} +{{Rails-Logo}} +{{Rubymine-Logo}} +{{Shell-Logo}} +{{Ubuntu-Logo}} +{{Visual Studio Code-Logo}} +{{CSS-Logo}} +{{}} +{{
}} +{{
}} +{{}} +{{Figma-Logo}} +{{}} {{
}} +{{
}} +{{}} +{{Docker-Logo}} +{{}} +{{
}} diff --git a/content/ss24/bachelor/b2-makesign/ubuntu.jpg b/content/ss24/bachelor/b2-makesign/ubuntu.jpg new file mode 100644 index 00000000..e7cc7e57 Binary files /dev/null and b/content/ss24/bachelor/b2-makesign/ubuntu.jpg differ diff --git a/content/ss24/bachelor/b2-makesign/vsc.jpg b/content/ss24/bachelor/b2-makesign/vsc.jpg new file mode 100644 index 00000000..9eccde5b Binary files /dev/null and b/content/ss24/bachelor/b2-makesign/vsc.jpg differ diff --git a/content/ss24/bachelor/b2-makesign/whatsapp.jpg b/content/ss24/bachelor/b2-makesign/whatsapp.jpg new file mode 100644 index 00000000..654cac37 Binary files /dev/null and b/content/ss24/bachelor/b2-makesign/whatsapp.jpg differ diff --git a/content/ss24/bachelor/b2-makesign/zoom.jpg b/content/ss24/bachelor/b2-makesign/zoom.jpg new file mode 100644 index 00000000..5bce1682 Binary files /dev/null and b/content/ss24/bachelor/b2-makesign/zoom.jpg differ