Digital Media CMS

Category: UXID

  • MoodSense: Revolutionizing Mood Tracking with Smart Ring Technology

    In an era where mental health awareness is paramount, MoodSense emerges as an innovative solution developed by a student from Drexel University’s User Experience and Interaction Design (UXID) program. This Apple Watch interface, paired with smart ring technology, aims to accurately detect users’ moods and provide personalized activities for self-improvement.

    The Challenge: Beyond Novelty Mood Rings

    Traditional mood rings, while popular, are merely novelty items that change color based on body heat. MoodSense addresses this limitation by leveraging advanced smart ring technology to provide accurate mood detection based on comprehensive health data.

    Innovative Technology

    MoodSense utilizes PPG (Photoplethysmography) technology in smart rings to collect various health metrics from the skin’s surface, including:

    • Sleep patterns
    • Body temperature
    • Heart rate
    • Activity levels
    • Blood oxygen
    • Stress levels

    Design Process and Features

    The development of MoodSense followed a comprehensive process:

    • Competitor Research: Identified gaps in existing smart ring applications.
    • Wireframing: Created low-fidelity prototypes to plan screens and navigation.
    • Design Inspiration: Drew from Apple Watch design standards and mood ring aesthetics.
    • Style Guide: Developed a cohesive visual language for the app.
    • Final Design: Refined the interface based on critical user paths.

    Key Features

    MoodSense offers unique functionalities:

    • Accurate mood identification based on health data
    • Personalized activity suggestions for mood improvement
    • Social features to send encouragement to friends
    • Color and shape associations for different moods

    User Experience

    The final prototype, created using Figma, offers an interactive experience showcasing the app’s core functionalities. Users can explore mood detection, receive personalized activities, and engage with friends, all through an intuitive Apple Watch interface.

    MoodSense represents a significant step forward in mood tracking and mental health support. By combining cutting-edge smart ring technology with a user-friendly Apple Watch interface, it offers users a powerful tool to understand and improve their emotional well-being.

  • WordFor: Revolutionizing Language Learning Through Interactive Design

    Drexel University’s User Experience and Interaction Design (UXID) program continues to foster innovation in digital education. A prime example of this innovation is WordFor, an ingenious language learning application developed by UXID students.

    WordFor goes beyond being a simple vocabulary app; it’s a demonstration of how user-centered design principles can be applied to educational technology. This project showcases the application of UXID skills to create solutions for real-world challenges, specifically addressing the often daunting task of learning a new language.

    Key Features of WordFor

    Interactive Learning: The app employs a unique approach where users learn new words by associating them with images, enhancing retention through visual memory.

    Personalized Experience: WordFor adapts to each user’s learning pace and preferences, ensuring a tailored educational journey.

    Gamification Elements: To maintain engagement, the app incorporates game-like features, making the learning process both enjoyable and effective.

    The UXID Approach

    This project highlights the multifaceted skills developed in the UXID program:

    User Research: In-depth studies were conducted to understand the needs and pain points of language learners.

    Iterative Design: The app went through multiple rounds of prototyping and testing, refining the user experience at each stage.

    Visual Design: The clean, intuitive interface of WordFor demonstrates proficiency in creating aesthetically pleasing and functional designs.

    Impact and Future Prospects

    WordFor serves as an impressive portfolio piece and has the potential to make a significant impact in the field of language education. It exemplifies how UXID principles can be applied to create tools that enhance learning experiences across various domains.

    Innovation in Action

    The WordFor project is just one example of the innovative work being done in Drexel’s UXID program. The curriculum empowers students to tackle real-world challenges, preparing them for dynamic careers in user experience and interaction design.

    At Drexel’s Digital Media department, the focus is not just on teaching design, but on shaping the future of digital interactions. WordFor stands as a testament to the program’s commitment to innovation, user-centered design, and practical application of technology in solving everyday challenges.

  • Nomnom: Revitalizing Recipe Websites with PHP and MySQL Integration

    In the ever-evolving world of culinary websites, Nomnom stands out as a shining example of innovation. This fictional recipe website, developed as part of Drexel University’s IDM 232: Scripting for Interactive Digital Media II course, showcases the power of combining engaging design with robust backend technology.

    The Challenge: Building from the Ground Up

    Nomnom’s project aimed to create an engaging, user-friendly interface while integrating dynamic features through PHP and MySQL. This comprehensive redesign faced several challenges:

    • Defining a clear vision for the website’s design and functionality
    • Seamlessly incorporating PHP and MySQL for dynamic content management
    • Ensuring high user engagement through intuitive design
    • Designing for scalability to accommodate future growth

    The Approach: User-Centric Design and Robust Development

    The development process was divided into three key phases:

    1. Discovery Phase

    This phase focused on creating comprehensive user personas to understand the diverse needs of potential users, ensuring a personalized and engaging experience.

    2. Design Phase

    The design phase involved:

    • Creating iterative wireframes and prototypes
    • Developing a comprehensive design system
    • Utilizing PHP for server-side scripting and MySQL for database management
    • Implementing a modular and scalable code structure
    • Ensuring responsive design for cross-device compatibility

    3. Feature Implementation

    Key features included a dynamic search and categorization system to enhance recipe discovery based on user preferences.

    The final solution boasts a visually appealing, modern interface with high-quality images and graphics, complemented by a robust database structure for efficient content management. This project not only resulted in a functional product but also provided valuable lessons in user-centric design, balancing creativity with functionality, and the importance of continuous iteration based on user feedback.

  • Tasty Tales: A Journey in PHP-Powered Recipe Website Development

    Over a 10-week period, a Drexel University student embarked on an individual project to create a responsive recipe website, diving deep into the world of PHP and database interactions. This endeavor, part of a class assignment, resulted in Tasty Tales – a dynamic, user-friendly platform showcasing 37 delectable recipes.

    The Challenge: Mastering PHP and Database Integration

    As a first-time PHP user, the student faced several challenges:

    • Navigating the intricacies of PHP programming
    • Resolving database errors
    • Creating a visually appealing website using HTML and CSS
    • Implementing dynamic data retrieval from a database

    Development Process

    The project unfolded in several stages:

    1. Creating a style tile for color scheme, font, and logo branding
    2. Designing wireframes for layout planning
    3. Developing the HTML and CSS structure
    4. Integrating PHP for dynamic recipe retrieval
    5. Implementing search and filter functionalities

    The Tasty Tales Solution

    The final product boasts several user-centric features:

    • A cohesive color scheme for visual appeal
    • Easy navigation through the recipe collection
    • Filter options for proteins
    • Nutritional information on recipe cards
    • Custom fonts and a well-defined style guide

    Key Achievements

    Tasty Tales successfully met its primary objectives:

    • Dynamic retrieval and display of all 37 recipes
    • Seamless search and filter functionalities
    • A responsive design ensuring a positive user experience across devices

    Lessons Learned

    The project provided valuable insights into PHP development and database management. For future improvements, the student noted the importance of thorough database preparation before diving into code integration.

    Tasty Tales stands as a testament to the power of individual learning and the potential of PHP in creating dynamic, user-friendly websites. It not only met its educational goals but also produced a functional, aesthetically pleasing platform for recipe enthusiasts.

  • Smoosh: Revolutionizing 3D Modeling with Haptic Technology

    In the evolving landscape of virtual reality and 3D modeling, Smoosh emerges as a groundbreaking solution developed by a Drexel University student. This innovative software aims to bridge the gap between traditional sculpting and digital 3D modeling by leveraging haptic glove technology.

    The Challenge: Making Digital Sculpting Feel Natural

    Traditional 3D modeling software often presents a steep learning curve, especially for those accustomed to physical sculpting. Smoosh addresses this challenge by:

    • Simplifying the creation of organic shapes in digital 3D models
    • Simulating real-world sculpting techniques effectively
    • Offering customization options to suit user needs and senses
    • Enabling export of base models for further refinement in other programs
    • Reducing overall modeling time

    Development Process

    The project unfolded in four key phases:

    1. Competitor and User Research
    2. Lo-fi Wireframing
    3. Styling
    4. Hi-fi Prototyping

    The Smoosh Solution

    Smoosh utilizes bHaptics haptic gloves to provide a tactile sculpting experience in a digital environment. Key features include:

    • Desktop application for ease of use without VR headsets
    • Gesture-based controls for intuitive modeling
    • Haptic feedback simulating physical clay manipulation
    • Simplified UI focusing on essential sculpting tools
    • Large, accessible buttons for both mouse and glove interaction

    User Interface Design

    The UI emphasizes a sandbox-style theme with:

    • Bright, soft colors for an artistic feel
    • Hand outlines for visual feedback in 3D space
    • Hidden menus that appear when hands are pushed to screen edges
    • Simplified settings and loading options for streamlined workflow

    Future Potential

    Smoosh represents a significant step towards making digital 3D modeling more accessible and intuitive. It opens doors for artists intimidated by traditional keyboard-mouse modeling, potentially revolutionizing the field of digital sculpting.

  • Dish Discovery: A Journey into PHP and Database Integration

    Dish Discovery, a project by Drexel University student Eli Goldberg, showcases the power of PHP and seamless database integration in creating a dynamic recipe website. This 10-week endeavor not only resulted in a functional product but also marked a significant learning curve for Eli in mastering PHP.

    The Challenge: Creating a Dynamic Recipe Website

    The primary objective was to develop a responsive recipe site that pulls data from a database using PHP. Key challenges included:

    • Familiarizing with PHP for the first time
    • Integrating a database seamlessly
    • Designing an intuitive user interface
    • Creating only two unique pages – a main recipe search page and a detailed recipe page

    Development Process

    The project unfolded in several stages:

    1. Initial research and user studies
    2. Design of logo, fonts, and color scheme
    3. Building static pages with HTML, CSS, and JavaScript
    4. Integrating PHP and database functionality
    5. Fine-tuning, debugging, and quality testing

    Key Features and Innovations

    Dish Discovery stands out with its user-centric features:

    • Multiple filter selection for customized recipe searches
    • Consideration for users with dietary restrictions
    • Clear and consistent recipe presentation
    • Responsive design for various screen sizes

    Overcoming Technical Challenges

    A significant hurdle was implementing multiple filter selections. Eli solved this by using checkbox elements within a form, utilizing the POST method, and creating a function to detect and format multiple selections for database queries.

    Results and Future Improvements

    The project successfully met its goals, providing a functional and user-friendly recipe website. Future enhancements could include:

    • Improved overall branding
    • Expanded filter categories beyond protein choices
    • Enhanced search capabilities

    Dish Discovery not only serves as a testament to Eli’s growing skills in web development but also provides a valuable platform for recipe enthusiasts to explore and discover new dishes with ease.

  • Thunk: Sparking Creativity and Connection Through Divergent Thinking

    From Drexel University’s Interactive Digital Media class of 2021 comes “Thunk,” an engaging game designed to foster social interaction and ignite creative thinking. Developed by a team of talented students from the User Experience and Interaction Design (UXID) program, Thunk brings players together in a social setting, encouraging them to explore their creativity through divergent thinking.

    The Concept

    Thunk challenges players to generate as many responses as possible to a series of prompts over six rounds. The game’s unique element lies in the “switch-ups” – constraints that add complexity to the prompts, requiring players to think outside the box and adapt to unexpected challenges. The random pairing of prompts and switch-ups ensures variability and high replayability in each playthrough.

    Research-Informed Design

    The development of Thunk was deeply rooted in user research. The team began by conducting interest interviews to gain insights into player preferences. Participants were presented with sample questions based on creative exercises developed by Cas Holman, along with questions about social games they enjoy.

    The team identified Fibbage XL, Quiplash 2, and Drawful 2 as popular choices, noting that engaging digital social games require a distinct personality, akin to a game show host, and a central screen that players connect to via personal devices.

    User Interface

    The team followed a three-step agile design cycle:

    • Create and Iterate: Team members worked on individual tasks, often collaborating on the same task simultaneously.
    • Discuss and Evaluate: The team reconvened to present and discuss their ideas.
    • Merge Designs: Ideas were refined and integrated.

    The challenge for the UI team was to create a design that conveyed creativity while maintaining web accessibility. They selected a color scheme of pinks and purples, paired with Avenir Next and McLaren fonts, and used Gilbert for the logo. While achieving AAA accessibility standards proved difficult without compromising the aesthetics, they were able to create a distinct visual identity for Thunk.

    Development and Technical Challenges

    Thunk was developed using NodeJS and Socket.IO. NodeJS was chosen for its ability to handle dynamic server-side actions, while Socket.IO facilitated simultaneous connections and communication between multiple devices.

    The development team faced challenges in scaling up their proof-of-concept prototype, which revealed the need for features like room creation and user identification. The team learned a lot about working with server-side JavaScript.

    Key Takeaways

    The creation of Thunk proved to be a valuable learning experience for the entire team. While the final product may not have met all initial goals, the development process yielded valuable insights. Key lessons learned included:

    • Improved project planning and goal setting, especially when working with unfamiliar technologies.
    • The importance of constant and clear communication among team members.
    • The critical need for effective time management, as team members’ progress was heavily reliant on each other’s work.

    Thunk stands as a testament to the collaborative spirit and innovative potential within Drexel’s UXID program. The team’s dedication to user-centered design, coupled with their willingness to tackle technical challenges, resulted in a project that not only fosters creativity but also offers valuable lessons in teamwork and project management.

  • Wallflower: A Digital Companion for Managing Social Anxiety

    Navigating social anxiety can be a daily challenge, but what if there was a digital companion designed to provide immediate support? Enter Wallflower, an innovative browser-based app created by students from Drexel University’s User Experience and Interaction Design (UXID) program.

    Understanding the Challenge

    The journey began when Kara Butler, a member of the team, experienced social anxiety at a public event and found existing resources lacking. This personal insight sparked the question: How can we assist people in managing feelings of social anxiety without long-term commitment?

    Research and Discovery

    The team embarked on a six-month project, initially facing challenges in gathering qualitative data due to ethical guidelines surrounding psychological research. Instead, they turned to reputable sources like the National Institute of Mental Health and the Mayo Clinic to understand the causes and symptoms of social anxiety.

    Competitive analysis revealed that existing apps often focused on single tools or long-term therapy, missing the mark on providing immediate, accessible support. Surveys of Philadelphia students aged 18-25 further highlighted diverse needs, leading to the creation of user personas like Lorne, Darla, and Barry.

    The Solution: Wallflower

    Wallflower offers seven content types designed to relax, uplift, and inspire:

    • Affirmations: Motivational phrases for courage.
    • Icebreakers: Phrases to initiate conversations.
    • Sounds: Soothing tracks backed by science.
    • Meditations: Grounding exercises.
    • Articles: Advice from credible sources.
    • Puzzles: Hands-on distractions.
    • Journal: A private space for reflection.

    Users can save content, filter by category, and access an S.O.S. section with hotlines, all without requiring a login.

    The Design Process

    The team embraced an agile workflow, dividing into App and Projects teams to handle multimedia, usability testing, content injection, development, and marketing. Visual design was inspired by the clematis vine, symbolizing support, with a color palette evoking fresh, warm, garden scenes.

    However, not every idea made it to the final product. A chatbot feature and texting integration were cut due to feasibility and ethical concerns, while a mood-tracking journal was scrapped due to limitations in data analytics.

    User Feedback and Impact

    Through iterative testing and feedback, the team refined Wallflower’s aesthetics and functionality. Ultimately, Wallflower aims to provide a bit of extra support to those who may feel like a wallflower in social situations, offering tools to grow and thrive.

  • Momentum: Photo Sharing and Community Engagement for Enhanced Productivity

    In today’s fast-paced world, staying motivated and focused on tasks can be a significant challenge. Students from Drexel University’s User Experience and Interaction Design (UXID) program tackled this problem head-on, creating Momentum, a social productivity app that leverages photo sharing and community engagement to help users achieve their goals.

    Project Introduction

    The Momentum team prioritized research and design, focusing on their strengths to develop a user-centric solution. Over 20 weeks, they conducted thorough research to identify user pain points and iterate on design concepts, culminating in an app prototype designed to resonate with their target audience.

    Research Insights

    Preliminary surveys revealed that many users find existing productivity tools ineffective in maintaining focus and motivation, leading to feelings of stress. Users also expressed a desire for autonomy and control over progress checks. This feedback led the team to prioritize user-driven features and customization options.

    The team’s research also highlighted the importance of accountability and community, with a significant percentage of users emphasizing the value of body doubling for staying productive.

    Design Exploration

    During the design exploration phase, the team focused on creating a brand identity that resonated with the core values of motivation, focus, and productivity. They chose blue as the primary color for its calming and productive associations and incorporated wave imagery to symbolize forward movement and energy.

    Iterative Design Process

    The team employed an iterative design process, progressing from low-fidelity to high-fidelity wireframes, incorporating user feedback at each stage. Changes included adding more detailed information to task cards based on user requests for better organization.

    Development and Prototype

    Recognizing their team’s strengths in design and research, the students pivoted to create an interactive prototype using Figma’s variable tool. This allowed them to effectively showcase the app’s functionality and user experience.

    Conclusion

    Momentum showcases the power of user-centered design and the adaptability of the Drexel UXID students. By prioritizing research, design, and iterative prototyping, the team created a promising solution for enhancing productivity and fostering a sense of community.

    Reflection

    The Momentum team’s journey highlights the importance of collaboration, problem-solving, and continuous learning. While a fully functional app wasn’t feasible within the project’s scope, the team is proud of the research-backed design and the valuable lessons learned, which will undoubtedly inform their future projects.

  • Facets: Redefining Connection in the Dating App Landscape

    Tired of the endless swiping and superficial interactions that plague modern dating apps? Students from Drexel University’s User Experience and Interaction Design (UXID) program have reimagined the online dating experience with Facets, a platform designed to foster genuine connections and showcase the many sides of a person’s personality.

    The Problem: Dating App Disillusionment

    Today’s dating apps are often criticized for fostering a toxic culture of competition, ghosting, and endless scrolling. Users are reduced to mere profiles, leading to feelings of disposability and self-consciousness. In the quest to appear most desirable, true connections are often lost. The Facets team recognized these flaws and set out to create a solution tailored for college-aged individuals seeking meaningful, long-lasting relationships.

    Preliminary Research and Psychology Insights

    Preliminary research targeting dating app users aged 18-23 revealed that a significant percentage describe themselves as unsuccessful on dating apps. Key challenges included profile quality, communication barriers, and dissatisfaction with app features.

    Psychology research further underscored the negative impact of online dating, with phenomena like ghosting and orbiting exacerbating feelings of disappointment and self-doubt. These findings emphasized the need for innovative solutions that prioritize user experience and well-being.

    The Facets Solution: Mindful, Genuine Connection

    Facets differentiates itself through several key features:

    • Friend Contributions: Users can invite friends to contribute to their profiles, offering a multifaceted view of their personality.
    • Daily Profile Limit: This encourages selectivity and intentional decision-making.
    • Rejection-Free Model: Promotes a positive and supportive environment.

    Design and Development Process

    The team followed a user-centered design process, starting with sketches and lo-fi prototypes to explore core concepts. Mid-fi and hi-fi prototypes were then developed, incorporating user feedback to refine the app’s interface and functionality. The app was developed as a web app using React.

    Key Takeaways Guiding Facets

    • Encourage selectivity and intentional decision-making
    • Strike a balance between friend involvement and autonomy
    • Create a safe space for all users

    Conclusion

    Facets establishes new patterns in the saturated dating app market, encouraging users to feel uplifted and excited to put themselves out there. By challenging traditional dating app norms and prioritizing genuine interactions, Facets offers a fresh perspective on online connection.

    Future Improvements

    If the team had more time and resources, they would research and develop an algorithm to cater profiles to users’ needs, add microinteractions and animations to enhance the user experience, and consult with subject matter experts to leverage their insights on the dating app landscape.