Digital Media CMS

Category: UXID

  • A Peek Into UXID Electives

    Beyond core UXID coursework, electives offer students the chance to explore specialized topics that deepen their understanding of user research, product validation, and interactive app design. These courses provide hands-on experience with cutting-edge tools and methodologies, preparing students for the dynamic field of UX design. Here’s a look at some of the key electives offered in the UXID program and what students can expect to learn.

    The UXID elective courses allow students to focus on specific areas of UX design—from research and product validation to mobile and web application development. These courses help students build a competitive portfolio, gain experience with industry-standard tools, and prepare for careers in UX/UI design, product strategy, and app development.

    User Research Methodologies

    Understanding users is the foundation of UX design. This course teaches students how to construct, implement, and analyze user interviews to gain deep insights into their target audience. Students explore qualitative and quantitative research methods, persona development, and usability testing strategies.

    Example assignments include:

    • User Interview Reports: Conduct and synthesize interviews to identify pain points and user needs.
    • Affinity Diagrams: Organize research findings to discover common themes.
    • Persona Development: Create data-driven user personas for better design decisions.

    Validating Product Ideas

    This course focuses on how to design, implement, and measure multichannel experiences to ensure they deliver value for users and businesses. Students learn techniques such as competitive analysis, A/B testing, and customer journey mapping to validate product-market fit before development.

    Interactive App Design

    Building on Mobile Interactive Design I, this course guides students in converting web-based applications into cross-platform native mobile applications. Emphasis is placed on optimizing experiences across screen sizes and incorporating mobile-specific features.

    Students build and test dynamic web application prototypes using event-driven JavaScript frameworks like React or Svelte. The course focuses on user interaction design, animations, and responsive interface development.

  • Senior Year as an UXID Student

    Senior year in Drexel’s UXID program is the culmination of everything learned over the past three years. It’s a time to refine expertise, prepare for the job market, and, most importantly, complete and present the Senior Project at the Drexel Digital Media Showcase. This final year challenges students to apply their skills in a high-stakes, real-world setting, ensuring they graduate ready for careers in UX design.

    Core Classes

    Senior-year coursework focuses on specialization and professional preparation, with classes that guide students through their senior projects and advanced UX concepts:

    • Digital Media Senior Project (DIGM490): The three-term senior project where students research, design, and develop a UX solution to present at the Drexel Digital Media Showcase. Create professional media assets for a team-based senior project in a simulated real-world production environment. This course integrates academic and practical knowledge, emphasizing digital media production, best practices, and effective presentation skills through collaboration and teamwork.
    • Professional Practices in IDM (IDM401): This course provides a broad overview of the practices of all areas included in the fields related to interactive digital media, including organizational structure and roles, client communication and creative process, needs assessment, brief writing, brainstorming, concept development, pitches, pricing, proposals and presentations.
    • Electives: Many students explore course electives to focus on building their skills in the area of UXID that they want to pursue after graduation. Some of these courses include Validating Product Ideas, SwiftUI, and Javascript Frameworks (Svelte, ReactJS). Students also take this time to explore electives that interest them. Pave your own path!

    Skills You’ll Master

    By senior year, UXID students fine-tune their skills, focusing on industry-level expertise:

    Project Management & UX Strategy
    Work through a full design cycle, from research to high-fidelity prototypes.
    Collaboration & Stakeholder Communication
    Present work to clients, faculty, and potential employers.
    Usability Testing & Iteration
    Conduct multiple rounds of user testing to refine the final senior project.
    Showcasing & Pitching Work
    Prepare for the Drexel Digital Media Showcase, a key event where senior projects are presented to industry professionals.

    Preparing for the Drexel Digital Media Showcase

    The Digital Media Showcase is the highlight of senior year, giving students the opportunity to present their senior projects to faculty, industry professionals, and peers. Preparation includes:

    • Refining the Final Product: Ensuring designs are polished, user-tested, and ready for real-world application.
    • Crafting a Strong Presentation: Communicating the problem, research process, and final design solution clearly and effectively.
    • Building a Portfolio-Ready Case Study: Documenting the senior project for job applications and interviews.
    • Networking & Job Hunting: The showcase often attracts recruiters, making it an excellent opportunity to make professional connections.

    Tips for Success in Senior Year

    • Stay organized. Senior projects require months of research, iteration, and refinement—plan accordingly.
    • Seek feedback early and often. Use professors, peers, and industry mentors to improve your work.
    • Practice presenting. Strong presentation skills make a huge impact during the showcase and job interviews.
    • Apply for jobs early. Start networking and applying to UX roles before graduation to stay ahead.

    Looking Ahead

    With the senior project completed and graduation approaching, seniors enter the UX job market with a solid portfolio, professional experience, and industry connections. Whether heading into UX design, research, or strategy, the skills developed in the UXID program prepare students for the next step in their careers.

  • Junior Year as an UXID Student

    Junior year in Drexel’s User Experience & Interaction Design (UXID) program is a game-changer. This is the year where classroom learning meets real-world application, with many students entering their first co-op experience. It’s a time to refine skills, work on professional projects, and start thinking about the future of a career in UX.

    Core Classes

    While some students spend part of the year in their co-op placement, coursework continues to build on previous knowledge with a focus on advanced UX methodologies and industry applications. Key classes include:

    • IDM Workshop (IDM371, IDM372): Work in teams to analyze project requirements, strategize solutions, and develop high-fidelity prototypes with a usability focus.
    • Future Digital Media (DIGM475): Explore emerging trends in digital media through case studies, product analysis, and industry forecasting.
    • IDM Electives: Dive deeper into specialized topics like Validating Product Ideas, SwiftUI, or frameworks such as Svelte and ReactJS.

    Skills You’ll Learn

    Junior year pushes students to take their UX skills to the next level, including:

    • Professional UX Workflow: Collaborate with developers, PMs, and stakeholders on real projects
    • Design Systems & UI Libraries: Build scalable, reusable components for large teams
    • Advanced UX Research & Testing: Execute studies and apply user data to design decisions
    • Time & Project Management: Juggle co-op, coursework, and ongoing portfolio development

    Projects & Real-World Challenges

    The biggest shift in junior year is the transition from theoretical projects to real-world problem-solving. Co-op students get hands-on experience working with clients, building products, and learning how UX functions in a business setting. For those still in coursework, projects become more advanced, often requiring collaboration with companies or interdisciplinary teams.

    Tips for Success

    • Make the most of your co-op: Take initiative, ask questions, and try to own part of a real product.
    • Refine your portfolio: Include co-op work (with permission) and highlight real-world problem-solving.
    • Build industry connections: Attend networking events, keep in touch with mentors, and follow up after co-op ends.
    • Stay adaptable: Learn to adjust to varying UX workflows and team structures.

    Looking Ahead

    With junior year coming to a close, senior year is all about specializing in UX fields of interest, completing capstone projects, and preparing for post-grad career opportunities. The experiences gained in co-op and advanced coursework will shape the path toward becoming a full-fledged UX professional.

  • Pre-Junior Year as an UXID Student

    Pre-junior year in Drexel’s UXID program is a pivotal time as students transition from coursework to real-world applications. With foundational skills in design, research, and front-end development already established, this year focuses on refining expertise, building a professional portfolio, and preparing for co-op experiences.

    Core Classes

    As UXID students move into more specialized areas, coursework becomes more project-driven, collaborative, and industry-focused. Key classes include:

    • User Experience Design (IDM215, IDM216): In this two-term course, students will design exceptional digital experiences through user-centered practices. Covering brand personality, research, content strategy, information architecture, and usability, they will develop predictive, enjoyable designs and build fully functioning web apps while executing a full production pipeline.
    • Storytelling for User Experience Design (IDM418): Learn how to use stories to understand the user, their goals and objectives, explain research, and describe design concepts.
    • Microinteractions (IDM241): Create exceptional digital experiences using user-experience design principles. This course covers brand personality, content strategy, information architecture, and usability to develop predictive, enjoyable interactions.
    • Content Management Systems (IDM250): Set up a content management system and develop a custom theme, focusing on project planning, organization, and maintaining a high-quality code base.

    Skills You’ll Learn

    This year is all about honing skills that make a UX designer stand out in the job market:

    • High-Fidelity UI Design: Build pixel-perfect designs that align with branding and user needs.
    • Data-Driven Design Decisions: Use research insights to validate design choices.
    • Advanced Prototyping & Microinteractions: Bring interfaces to life with motion design and animations.
    • Presentation & Client Communication: Learn to present ideas effectively to stakeholders and potential employers.

    Projects & Challenges

    Pre-junior year involves tackling more complex, multi-step design challenges. Many classes incorporate real-world projects where students work on UX solutions for businesses, startups, or nonprofits. Expect to create comprehensive case studies—documenting research, design iterations, and usability testing—which will become essential for building a strong UX portfolio.

    Tips for Success

    • Build a professional portfolio: Showcase your best projects with detailed case studies.
    • Master storytelling in design: Clearly communicate your design decisions and process.
    • Engage with the industry: Attend UX networking events, join online communities, and start connecting with professionals.
    • Prepare for co-op: Research companies, tailor your resume, and refine interview skills for UX positions.

    Looking Ahead

    The pre-junior year serves as a bridge between academic learning and hands-on industry experience. With co-op opportunities on the horizon, students will soon apply their skills in professional settings, gaining real-world insights that will shape their careers.

  • Sophomore Year as an UXID Student

    Sophomore year in the User Experience and Interaction Design (UXID) program at Drexel University takes design skills to the next level. After covering the fundamentals in freshman year, students now dive deeper into interaction design, usability testing, and more advanced prototyping techniques. This year is all about refining skills, tackling real-world projects, and preparing for future co-op opportunities.

    Core Classes

    The courses in sophomore year build on foundational knowledge, introducing more complex design concepts and industry tools. Key classes include:

    • Web Design (IDM221, IDM222): Learn how to create and maintain quality web sites, and learn about accessibility and web design standards, and why they are important.
    • Human Factors Engineering (IDM214): Discuss ways of applying psychological and physiological principles to the design of interactive systems, products, processes, and systems to address human capabilities and limitations in ways that ensure safety, effectiveness, and ease of use.
    • Scripting for Interactive Digital Media (IDM231): Explore modern client-side scripting languages that interact with the user, control the browser, communicate asynchronously, and alter document content and functionality.

    Skills You’ll Learn

    By the end of sophomore year, UXID students will have developed essential industry skills, including:

    Advanced Prototyping – Create high-fidelity designs with tools like Figma and Adobe After Effects.

    Usability Testing & Research – Conduct A/B testing, analyze user behavior, and refine user experiences.

    Web Development – Use HTML, CSS, and JavaScript to bring your designs to life.

    Accessibility & Inclusive Design – Ensure products are usable for diverse audiences.

    Projects & Challenges

    Sophomore year coursework emphasizes real-world applications. Expect projects that involve designing full user interfaces, conducting user research, and building interactive prototypes. A major challenge at this stage is balancing design and functionality—ensuring that an interface is not just visually appealing but also intuitive and accessible.

    Tips for Success

    Refine your portfolio. Start documenting projects and case studies for future co-op applications.

    Hone your research skills. Usability testing and user feedback are crucial for great design.

    Experiment with coding. Even a basic understanding of JavaScript can give designers an edge.

    Network and seek mentorship. Connecting with UX professionals can open doors to internships and career opportunities.

    Looking Ahead

    Sophomore year is a crucial time for skill-building and preparation for Drexel’s co-op program. The next step? Pre-Junior year introduces more specialized courses, industry collaborations, and professional experience through co-op placements.

  • Freshman Year as an UXID Student

    Starting the UXID program at Drexel University is an exciting step toward a career in design and technology. The first quarter introduces key UX concepts, essential tools, and hands-on projects that build a strong foundation for the years ahead. Here’s what to expect in your first term.

    Freshman year begins with a mix of UXID courses and general education classes. The first quarter is just the beginning. Upcoming courses will dive deeper into interaction design, usability testing, and advanced prototyping, helping you refine your skills for real-world UX challenges.

    Core Classes

    Freshman year begins with a mix of UXID courses and general education classes. Some key courses include:

    • User Interface Design (IDM211, IDM212): Learn to design aesthetically pleasing interfaces using design principles and human-centered thinking.
    • Interaction Design (IDM213): Explore interaction principles and patterns that define how users engage with digital systems and services.
    • Design Thinking in Product Design (PROD215): Learn design research methods and tackle topical design challenges through design thinking exercises.

    Skills You’ll Learn

    User Research
    Conduct interviews, surveys, and usability tests
    Prototyping & Wireframing
    Use Figma to create low-fidelity wireframes
    Design Iteration
    Refine work based on feedback and testing

    Projects & Challenges

    Expect hands-on projects from day one. A common first-quarter assignment is redesigning an app’s onboarding experience—identifying pain points, creating new user flows, and testing solutions. The biggest challenge? Learning to embrace feedback and refine designs through multiple iterations.

    Tips for Success: Get comfortable with Figma early—it’s a core tool in UX design. Seek feedback often—iteration is key to improving designs. Manage your time wisely—balancing projects and coursework can be tricky. Engage with the UXID community—networking and student groups can offer valuable insights.

  • Slime Rancher Zodiac

    IDM231: Scripting for Interactive Digital Media I

    By Amy Au – 2024

  • Arduynthisizer: A Digital Arduino Piano

    IDM382: Internet of Things by Wynn O’Donnell

    Overview

    For this project, I worked on developing an Arduino Piano with sound that can be modified and played through a browser. I called the original product in West107 the Arduorgan, a combination of the word Arduino, and the word Organ, a large piano-like musical instrument. If I go through with that theme this project will be called the Arduynthesizer, as it is an Arduino synthesizer. The Arduynthesizer will send signals to a browser when a button is pressed on it, and the browser will produce a sound based on the settings selected in the browser. The user will control the Arduynthesizer by pressing buttons on the Arduino, and by changing settings in a browser window with sliders. These sliders will include Pitch, volume, and tone.

    Breadboard with Arduino, wires, and buttons, showing the layout of the project.

    Goals

    • Add more features to an Arduino piano I created in West107
    • Make it more like a synthesizer
    • Add variation to the sounds it can produce
    • Make the sound to be able to be controlled and heard from a browser window

    Final Presentation

    Sample Code

                /* 
              #include "thingProperties.h"

              const int buttonPin1 = 2;
              const int buttonPin2 = 3;
              const int buttonPin3 = 4;
              const int buttonPin4 = 5;
              const int buttonPin5 = 6;
              const int buttonPin6 = 7;
              const int buttonPin7 = 8;// the number of the pushbutton pin
              const int ledPin =  13;      // the number of the LED pin
              int buttonState1 = 0;
              int buttonState2 = 0;
              int buttonState3 = 0;
              int buttonState4 = 0;
              int buttonState5 = 0;
              int buttonState6 = 0;
              int buttonState7 = 0;
              
              String buttonpressStr1 = "Play C Note";
              String buttonpressStr2 = "Play D Note";
              String buttonpressStr3 = "Play E Note";
              String buttonpressStr4 = "Play F Note";
              String buttonpressStr5 = "Play G Note";
              String buttonpressStr6 = "Play A Note";
              String buttonpressStr7 = "Play B Note";
              
              void setup() {
                // Defined in thingProperties.h
                initProperties();
                  // Initialize serial and wait for port to open:
                Serial.begin(9600);
                // This delay gives the chance to wait for a Serial Monitor without 
                blocking if none is found
                delay(1500); 
                  // initialize the LED pin as an output:
                pinMode(ledPin, OUTPUT);
                // initialize the pushbutton pin as an input:
                pinMode(buttonPin1, INPUT);
                pinMode(buttonPin2, INPUT);
                pinMode(buttonPin3, INPUT);
                pinMode(buttonPin4, INPUT);
                pinMode(buttonPin5, INPUT);
                pinMode(buttonPin6, INPUT);
                pinMode(buttonPin7, INPUT);
              
                // Connect to Arduino IoT Cloud
                ArduinoCloud.begin(ArduinoIoTPreferredConnection);
                
                /*
                   The following function allows you to obtain more information
                   related to the state of network and IoT Cloud connection and errors,
                   the higher number the more granular information you’ll get.
                   The default is 0 (only errors).
                   Maximum is 4
               */
                setDebugMessageLevel(2);
                ArduinoCloud.printDebugInfo();
              }
              
              void loop() {
                ArduinoCloud.update();
                // Your code here 
                  buttonState1 = digitalRead(buttonPin1);
                  buttonState2 = digitalRead(buttonPin2);
                  buttonState3 = digitalRead(buttonPin3);
                  buttonState4 = digitalRead(buttonPin4);
                  buttonState5 = digitalRead(buttonPin5);
                  buttonState6 = digitalRead(buttonPin6);
                  buttonState7 = digitalRead(buttonPin7);
              
                // check if the pushbutton is pressed. If it is, the buttonState is HIGH:
                if (buttonState1 == HIGH) {
                  // turn LED on:
                  digitalWrite(ledPin, HIGH);
                  Serial.println("Play C Note");
                  messenger = buttonpressStr1;
                } else {
                  // turn LED off:
                  digitalWrite(ledPin, LOW);
                }
                  if (buttonState2 == HIGH) {
                  // turn LED on:
                  digitalWrite(ledPin, HIGH);
                  Serial.println("Play D Note");
                  messenger = buttonpressStr2;
                } else {
                  // turn LED off:
                  digitalWrite(ledPin, LOW);
                }
                  if (buttonState3 == HIGH) {
                  // turn LED on:
                  digitalWrite(ledPin, HIGH);
                  Serial.println("Play E Note");
                  messenger = buttonpressStr3;
                } else {
                  // turn LED off:
                  digitalWrite(ledPin, LOW);
                }
                  if (buttonState4 == HIGH) {
                  // turn LED on:
                  digitalWrite(ledPin, HIGH);
                  Serial.println("Play F Note");
                  messenger = buttonpressStr4;
                } else {
                  // turn LED off:
                  digitalWrite(ledPin, LOW);
                }
                  if (buttonState5 == HIGH) {
                  // turn LED on:
                  digitalWrite(ledPin, HIGH);
                  Serial.println("Play G Note");
                  messenger = buttonpressStr5;
                } else {
                  // turn LED off:
                  digitalWrite(ledPin, LOW);
                }
                  if (buttonState6 == HIGH) {
                  // turn LED on:
                  digitalWrite(ledPin, HIGH);
                  Serial.println("Play A Note");
                  messenger = buttonpressStr6;
                } else {
                  // turn LED off:
                  digitalWrite(ledPin, LOW);
                }
                    if (buttonState7 == HIGH) {
                  // turn LED on:
                  digitalWrite(ledPin, HIGH);
                  Serial.println("Play B Note");
                  messenger = buttonpressStr7;
                } else {
                  // turn LED off:
                  digitalWrite(ledPin, LOW);
                }
              }//End loop
              
              
              void onMessengerChange() {
                // Do something
              }

  • Reading Realm LED NeoPixel: Using Technology to Promote Education

    IDM382: Internet of Things by Leanne Chin

    Overview

    Over the past 11 weeks, I worked on developing a device using the Internet of Things to be able to control a series of NeoPixel lights using a web browser in order to promote the use of technology to better the fundamental developmental growth of early childhood education. Through this project, I not only learned about the educational benefits that colors bring to a child’s education but also the process of understanding how to wire breadboards and work with Arduino without short-circuiting any equipment. I learned how to use a variety of different tools to reach my goal of working on my device online and how to adapt my code to each program.

    LED lights with a recording of the controller interface in the bottom right corner to turn lights on and off.

    Goals

    • Allow online access from online dashboard to control LED lights
    • Debug problem with sticky buttons
    • Debug problem where clicking onto one button

    Final Presentation

    Future Plans

    • Seeing if it is possible to attach a projector to the Arduino
    • Developing an interactive story book projector that reacts to the buttons that are pressed using IoT

    Sample Code

     
void loop() {
    ArduinoCloud.update();
    // Your code here 
    //Serial.println("looping");
    
    for(int i=0;i<NUMPIXELS;i++){

      // pixels.Color takes RGB values, from 0,0,0 up to 255,255,255
      pixels.setPixelColor(i, pixels.Color(redColor, greenColor, blueColor)); 
      // Moderately bright green color.

      pixels.show(); // This sends the updated pixel color to the hardware.

      delay(delayval); // Delay for a period of time (in milliseconds).
      
      // Serial.println(i);
      
    }
    
  } // END LOOP 


  void onLEDbuttonChange() {
    // Do something
  }

  void onButton1Change() {
    // Do something
    
    Serial.println("virtual button click");
    
    lEDbutton = "Button Color 1 Pushed";
      
      noColor();
    
  } // End Here

  void onButton2Change() {
    // Do something
    
    lEDbutton = "Button Color 2 Pushed";
    
    setColor();
    
  } // End Here


  void onButton3Change() {
    // Do something
    
    lEDbutton = "Button Color 3 Pushed";
    
    setColor2();
  }

  void noColor() {
    redColor = 0;
    greenColor = 0;
    blueColor = 0;
  };


  void setColor(){
    redColor = 0;
    greenColor = 255;
    blueColor = 255;
    Serial.print("red: ");
    Serial.print("green: ");
    Serial.print("blue: ");
    
  };

  void setColor2() {
    redColor = 255;
    greenColor = 0;
    blueColor = 255;
};

  • Japanese Recipe Card

    IDM241: Microinteractions

    By Kara Butler – 2022