Projektthema
Der Kurs befasst sich mit der Gestaltung und Entwicklung einer interaktiven Anwendung,
die im Kontext von Ausstellungen, Museen oder Messen Wissensgebiete verständlich
erfahrbar macht.
Inhalt des Faches Ziel ist das Kennenlernen grundlegender Zusammenhänge im Bereich der Mensch-Computer-Interaktion und der Informationsgestaltung. Die Studenten befassen sich mit grundlegenden Interaktionsformen und medienspezifischen Gestaltungsproblemen, der Beziehung von Text, Bild und Animation sowie der protoypischem Umsetzung oder Simulation solcher Anwendungen.
In our search for the perfect design, we explored a multitude of inspirations spanning digital interfaces, artistic expressions, and real-world aesthetics. From contemporary trends to timeless classics, we sought to distill the essence of captivating and user-friendly screens.
Our journey encompassed everything from seamless navigation in well-designed applications to the emotional impact of carefully curated color palettes. We drew inspiration not only from the digital realm but also from nature, architecture, and various art forms, weaving together a tapestry of influences to infuse our screens with a distinctive character.
Through meticulous iterations, we refined the visual language, ensuring that each screen not only met functional requirements but also enhanced the overall user experience. The end result reflects our commitment to delivering a product that seamlessly combines aesthetics and usability, exceeding expectations.
Strategic Decision-Making in Design
The developmental trajectory of this project followed a comprehensive and deliberate course. Initiating the process, our team engaged in an ideation phase, where we systematically generated and assessed various concepts. Swiftly, a consensus emerged in favor of an interactive table, featuring Arduino integration and projection of a Figma prototype. This decision stemmed from a judicious evaluation of the project’s objectives and the desired user experience.
Following the ideation phase, our focus pivoted towards the meticulous design of the interactive table. This encompassed not only the hardware elements but also the intricacies of the projected Figma prototype. Delving into the specifics, we strategically formulated the layout for the actual screens that would be displayed and projected in the subsequent phases of the project. This phase required careful consideration of user interactions, visual aesthetics, and the seamless integration of the proposed technology.
The decision-making process involved a balance between functionality and user engagement, as we aimed to create an immersive and intuitive experience for end-users. Through a collaborative effort, we arrived at a finalized layout that aligns with the project’s overarching goals and provides a solid foundation for the subsequent development stages. This meticulous planning and decision-making phase sets the stage for the implementation and execution of the interactive table project, ensuring that each element is purposefully designed to enhance user interaction and overall usability.
Very first sketch
In our commitment to developing a design that transcends potential aversions and resonates with a diverse audience, we have purposefully embraced a terrarium-inspired aesthetic for our project. Acknowledging that not everyone shares an innate fondness for spiders, we sought a friendlier approach. The chosen terrarium theme not only adds visual appeal but also symbolises inclusivity, achieved through the deliberate use of a circular enclosure to house the spiders. This circular form not only contributes to a cohesive visual narrative but also signifies our intent to create a controlled and captivating environment, fostering curiosity rather than discomfort.
The terrarium-inspired look serves as a thoughtful design strategy, ensuring that our project is both approachable and engaging. Through this deliberate choice, we aspire to create an inclusive and enjoyable experience for all users, irrespective of their attitudes toward spiders.
In our iterative design process, we transitioned from a Procreate sketch to a Figma prototype, strategically allocating space to optimize user engagement. The left side is designated for the spider-catching zone, fostering an interactive and dynamic experience. On the right side, we have allocated space for information display, ensuring a seamless blend of entertainment and educational content.
Upon further consideration, we identified the need for more refined spider representations. To enhance visual appeal and accuracy, we deliberated on two options: illustration or 3D modeling using Cinema 4D. This pivotal decision will significantly impact the project’s aesthetic and immersive qualities, prompting us to carefully weigh the advantages of each approach.
To streamline user navigation, we compartmentalized our menus into three distinct sections: ‘Get to Know Me,’ providing insights into the spider’s personality; ‘Behaviour,’ delving into its habits and interactions; and ‘Anatomy,’ offering an in-depth exploration of the spider’s physical attributes. This deliberate categorization ensures a structured and user-friendly interface, catering to diverse user interests and providing a comprehensive exploration of the captivating world of spiders.
Change of layout
Upon closer examination, we recognized an abundance of information within our project, and a realisation surfaced that we were underutilizing the available screen space. The challenge lay in the surplus of white space, prompting us to reassess our approach and find a viable solution to accommodate the wealth of information seamlessly.
In response to this insight, we embarked on a refinement process, aiming to optimise the layout for enhanced information display. By strategically addressing the white space issue, we sought to create a more comprehensive and engaging user experience. Our endeavour revolves around finding a balance that ensures all pertinent information is presented efficiently without overwhelming the user, thereby maximising the utility of the entire screen real estate.
Despite introducing color into the design, a subsequent evaluation revealed lingering dissatisfaction with the screens. In light of this realisation, our team decided to pivot and explore an alternative approach. This strategic shift underscores our commitment to achieving a design that not only incorporates vibrant visuals but also aligns seamlessly with our overarching objectives.
The pursuit of a more satisfying and effective solution reflects our dedication to delivering an optimal user experience and underscores the iterative nature of the design process.
Final adjustments
Buttons
In our pursuit of simplifying Arduino integration, we strategically incorporated three static buttons within the interface. This addition streamlines user interactions, providing a straightforward and efficient means to navigate through the screens and enhance the overall usability of the project. The static buttons serve as intuitive control elements, ensuring a more accessible and user-friendly experience for individuals interacting with the system.
3D rendering
For a more immersive and visually captivating representation of spiders, we opted for a 3D rendering approach. This choice not only elevates the aesthetic appeal of the project but also enables a more detailed and lifelike depiction of the spiders. By leveraging 3D rendering technology, we enhance the overall user experience, offering a dynamic and engaging exploration of the arachnid world.
Meniu sections
Our commitment to user-friendly information access is reflected in the structured layout of three distinct sections: ‘About Me,’ providing insights into the spider’s personality; ‘Body Parts,’ offering a detailed exploration of its anatomy; and ‘X-Ray,’ providing a unique perspective. This segmentation ensures clarity and ease of navigation, catering to diverse user interests and creating a comprehensive educational experience.
Rotary encoder
To facilitate seamless navigation through the project’s content, we implemented a rotary encoder. This intuitive input device allows users to effortlessly cycle through screens, enhancing user control and interactivity. The rotary encoder serves as a versatile and ergonomic solution, contributing to an enhanced overall user experience.
Additional information
In our design strategy, we harnessed the circular layout to dynamically display text around the circle. This innovative approach maximizes the use of available screen space, providing a continuous and fluid reading experience for users exploring the informational content. The circular arrangement ensures a cohesive visual narrative, contributing to an aesthetically pleasing and engaging interface.
Clustering information in the circle
Utilizing the circular design to its full potential, we employed it as a dual-purpose canvas for both information display and rendering of spiders. This integration optimizes screen real estate, creating a unified and visually striking presentation. By consolidating these elements within the circle, we achieve a harmonious blend of form and function, enhancing the overall design coherence.
Terrarium change
Upon successfully catching a spider, we implemented a dynamic feature that changes the outer terrarium. This interactive element adds a layer of excitement and progression to the user experience, reinforcing the notion of accomplishment. The evolving terrarium serves as a visual cue, signifying the user’s engagement and achievements within the interactive environment, further enriching the overall project narrative.
Hinterlasse einen Kommentar