UI/UX Designer at Northeastern University

A showcase of my work as a UX designer and web developer for Information Technology Services at Northeastern University. You can see the breadth of my work, which ranges from creating better user experiences for existing websites, to designing new interfaces for products, to developing micro-websites, to collaborating on various other digital content and assets. Take a look at my exciting journey.

UI/UX Designer at Northeastern University

This project showcases my work and involvements with Northeastern University Information Technology Services, ranging from creating better user experiences for existing products, designing and developing websites and other visual digital assets. Do check out my journey here.

UI/UX Designer at Northeastern University

This project showcases my work and involvements with Northeastern University Information Technology Services, ranging from creating better user experiences for existing products, designing and developing websites and other visual digital assets. Do check out my journey here.
Digital technologies – through efficiency gains, enhanced effectiveness, and broader access to distant customer segments – present companies with both new ways to solve old challenges and brand new opportunities. The post COVID-19 world is also likely to see new patterns of work. It is crystal clear that business transformation through digital technologies is the future for organizations that aspire to thrive in the future.

Moving towards Digital Transformation

Digital transformation incorporates a digital-first mindset. It is both a mindset and a strategy. It's a university-wide and Northeastern's Community-focused approach that relies on implementing digital technologies to execute current opportunities and create new options that make, deliver, and sustain unparalleled value.

Approach to build a Design System

While Northeastern University is evolving towards Digital Transformation and wants to provide technical support to our diverse community from any corner of the world with our exceptional experiential learning legacy, our world-class faculty who have digital transformation expertise, and our humanists-infused solid curriculum with technology, data, and human-centered literacies, our school is well-positioned to develop students and leaders for this brave new world of work.
In this effort, the digital service team and I collaborated with the Marketing and Communication team to develop a system that can serve as a common Design Language across all our digital applications, websites, and products.
We aimed to build a tool that, as a helping hand to designers, developers, folks in the Marketing and communication team across all the department at Northeastern University.
Another primary goal in our Digital Transformation goal was to retire all the website from our old servers and migrate it to new servers. This opened us a unique opportunity to implement our design system and make various iteration on it.

Objectives

  • This should help the organization as a tool to transform its digital presence to be consistent across all platforms.
  • It should focus on the larger scale and future organizational scope rather than ongoing or a single project.
  • It shouldn't be restrictive in any form. It should allow to boost creativity, thereby keeping consistency in place.
  • Clear and concise.
  • Diverse and Inclusive.
  • Futuristic and modular.

Building the design system

A living design document

We hosted our design system in collaboration with developers to built the components using HTML and CSS. This would be a great way to communicate the design throughout the university.

Design tools used

Figma, Miro, Wordpress Divi Theme

Doing something extra. Because why not?

Logo Generator

Addressing the problem of every department having their logo and designing on their own. We saw an opportunity to design and build something that every department can use to develop its logo that is on brand and can be consistent throughout.

Brief Description

During my time at Northeastern University Information Technology Services in March 2020, the lockdown was initiated due to Covid -19, causing the university to suspend all non-essential activities. I worked on many design tasks such as building communication and engagement workflows, updating the information architecture of several websites, and improving the user experience on multiple digital products.

Everything had to be shoved into overdrive. And why? Well, unprecedented times warranted extra effort. To ensure students weren't impacted by the lockdown, we needed to provide both staff and students with the tools they needed to continue learning.
Let’s proceed to view my role, my contribution as a UI/UX professional during troubling times.
For those looking to hire me, scroll to view/ learn about my approach and skills.
Looking to explore? The whole project is like 2020, new, exciting, and unordinary!
Lets get started

Taking the first step

When everything is so hard-n-fast and no one knows what the next step is what do you do then?
Northeastern’s primary plan of action involved setting-up a communication hub focusing on transparency, provide technical assistance, and information exchange.
What was my role/contribution? While content writers were writing their pieces, I was responsible for designing newsletter templates for communication emails. Previously, we used Constant Contacts for sending out emails and campaign ads. Since, the idea had been in the works, we realized it was the perfect opportunity to move away from a third-party vendor and use our internal servers to send those communications out.
The task at hand required both designing and developer skills. The developer in me brought the designs to life. The three HTML versions of the template are currently in use at Northeastern University.
Here are the three HTML versions of the newsletter template northeastern uses.

Setting up websites for communication

After communications went down, the University was looking to transition from Google's G-suite licenses to Microsoft office 365 licenses. As part of this effort, our team was required to Inform, Market, and Promote to prepare the Northeastern Community to adapt to the shift.
Some of the Websites designed and built by me are displayed/mentioned below.
01
For teacher and students

NUFlex Website

A safe, flexible, and hybrid way to teach and learn. Northeastern has implemented this structure to enable students to learn and schedule classes, on-ground and online. This modal titled "Hybrid-NUFlex" leverages new technology and flexible scheduling to equip students to connect and learn worldwide.

My Role

Visual Designer | Branding | Information Architect

02
For university

Microsoft Team's Website

A University initiative that serves as a digital hub for our community to bring conversations and content together. This website provides information to help people get started with the software and ease the migration process.

My Role

Visual Designer | Branding | Information Architect

Transition to a new Learning Management System

What is LMS? Learning Management System or LMS is a platform that schools and universities use to connect students and professors, enable easier access, collaboration and promote learning.

Blackboard was previously used as a university-licensed learning tool, but the call for a more collaborative and easy-to-use third-party software integration emerged during the pandemic.
''

Open, intuitive, and born in the cloud, Canvas streamlines all the digital tools and content that teachers and students love for a simpler and more connected learning experience. With Canvas, university community members will enjoy an LMS that is mobile-first, reliable, accessible, and can deliver highly customizable and experiential teaching and learning.

03
New LMS

Canvas Transition Website

Website designed to encompass the information regarding the transition to Canvas and highlight universities' next step towards digital transformation in online learning.

My Role

Visual Designer | Branding | Information Architect

The next steps in the migration process were to design instruction templates for our professor, who we did not get time to train because of lockdown. These one-pagers will help them understand the platform more appropriately and come in handy to those professors who aren't tech-savvy to go through Canvas Training modules.

Contactless Customer Service

Students and faculty looking to avail the hardware offered by the University, such as laptops, cameras, projector, etc., had no direct way to access them due to the pandemic. The previously used system interfered with newly set-up COVID regulations.

Therefore, we collaborated with the Technical Services and stakeholders of customer experience teams to develop a solution to provide students and faculties with a "Contactless Service for University Resources."

After an arduous brainstorming session, an idea, considering the limitations, Financial and Technical was developed. Vending Machines were approved to be set-up on-campus.

Customer Journey

Student downloads the tech service app and logs in with their Northeastern credentials.

Student goes through the list of the available items and selects an item that they require.

After confirming the details, the student receives information regarding the pick-up– Location, time for pick-up and further instructions.

Upon arrival at the vending machine, the student confirms their identity by scanning their college upon arrival at the vending machine, student confirms their identity by scanning their respective college ID

On successful verification, a validation process is run. The student receives an OTP, which is to be entered into the vending machine.

Finally, the student receives their package and a confirmation email.

At the end, student get their package and receives a confirmation mail.

Reopening Northeastern

Being one of the leading universities in Boston, Northeastern was the first to announce its reopening plan for Fall 2020. Following the CDC guidelines, Northeastern adopted all three strategies - screening, testing, and contact tracing to reduce the risk of COVID-19 transmission.
''

We know from surveys that overwhelmingly, students want to be back on campus this fall. We need our entire community engaged in some simple safety requirements, and we need students to lead the charge by reminding themselves and each other of why that’s important.

#PROTECTTHEPACK a campaign and Northeastern's new mantra for encouraging healthy behaviors throughout the university community. This effort required all the teams across the board to come together for the success of this campaign. As a team, we need to maintain a clear line of communication between the students, faculty, and staff.
01

Testing Center Signage

These signs are placed around campus to promote testing and guide students with the process. A print version has also been placed in the campus testing center for more visibility and marketing purposes.

My Role

Illustration | Branding

02

Campus Signage

As we return to campus, new signs were placed to help encourage behavior related to healthy distancing. Northeastern has diligently explored the use of signage to educate the community about the safest ways to navigate across the campus and maintain healthy distancing as best as possible.

My Role

Illustration | Branding

03

Testing Dashboard

The COVID-19 testing dashboard, which displays the daily number of positive and negative test results from the university’s testing lab.

My Role

Data Visualisation | Visual Design

My learnings

In a time of so much uncertainty, I believe I was blessed to stay safe and have worked to keep my fellow community safe through my design work. During my time in the ITS department, I took up challenges each day to produce a new poster design, building micro websites for communication, visualizing user experience, mapping out their journey, following the critical point of contact, etc. Building designs for the Northeastern Community and I appreciated the impact designs can make in real life. I learned to manage my design assets competently in order to improve personal productivity and participate in the next assignment with vigor. I want to thank my team for always having my back and bearing some of my shameful designs. Serving with this team made me realize that I could improve UX in every manner, be it small or big.
There are a lot more projects that I am currently involved in. Please do reach out to me if interested in knowing more about my ongoing projects.

Information Technology Services

Northeastern University's website serving as a platform to showcase our university technical team's contribution and services.
View Design mockups
Project Arrow Link
Visit Live Website
Project Arrow Link

Connect to Tech

A content-driven website serving as a technological guide to students, faculty, and staff by providing them essential links and resources to get started at Northeastern.
View Design Mockup
Project Arrow Link
Visit Live Website
Project Arrow Link

Research Computing

A micro-website connecting the research community at Northeastern University with high-performance computing solutions.
View Design Mockup
Project Arrow Link
Visit Live Website
Project Arrow Link

Academic Technology Services

A micro-website to bring students and faculty together for learning and collaboration. It provides resources that is designed to meet different educational challenges
View Design Mockup
Project Arrow Link
Visit Live Website
Project Arrow Link

Nano-medicine Research Website

A content-driven website serving as a technological guide to students, faculty, and staff by providing them essential links and resources to get started at Northeastern.
View Design Mockup
Project Arrow Link

Symposium for Teaching and Learning

A content-driven website serving as a technological guide to students, faculty, and staff by providing them essential links and resources to get started at Northeastern.
View Design Mockup
Project Arrow Link

NU-Flex Hybrid Teaching and Learning

A content-driven website serving as a technological guide to students, faculty, and staff by providing them essential links and resources to get started at Northeastern.

Canvas LMS

A content-driven website serving as a technological guide to students, faculty, and staff by providing them essential links and resources to get started at Northeastern.

Microsoft Teams Website

A content-driven website serving as a technological guide to students, faculty, and staff by providing them essential links and resources to get started at Northeastern.

Employee Engagement Design

Encouragement Card Design

Designs for office screens

01

Plastic Waste Problem

This infographic was created as a side project while I was doing a Design case study with Northeastern University to reduce plastic waste on campus. I created this infographic as part of secondary research in my design process.

Timeline : 1 weeks

View Infographic
02

Understanding Financial Literacy

As a part of a final project in one of my university courses, I created this infographic to persuade my audience. With this project, I aimed to guide viewers to a conclusion with facts and figures.

Timeline : 3 weeks

View Project
03

Service Excellence

A basic infographic to showcase the workings and progress of Tech Service Team at Northeastern University.

Timeline : 6 hours

View Project