Home
About
Project
Blog
Contact

All rights are reserved by Anuj Joshi © 2025

Portfolio
Portfolio
/
LIMSTIR-DTU

LIMSTIR-DTU

Thumbnail
https://drive.google.com/thumbnail?sz=w2480&id=1BzsSNX7IsIixIK6dAK3UtDKjQ2HFRvcH
Author
Anuj Joshi
Project
Project
Published
June 8, 2024
Tags
UI/UX Design
Tailwind-CSS
React.js
A responsive and user-focused website for LIMSTIR (Laboratory for Industrial & Multidisciplinary Socio-Technical Innovation & Research) at Delhi Technological University, built to showcase the lab’s research initiatives, faculty work, and industrial collaborations.

Introduction

LIMSTIR DTU is a static, fast-loading platform designed to serve as the digital front for one of DTU’s flagship innovation labs. It centralizes research projects, faculty profiles, event documentation, and industry engagement.
Built with performance and clarity in mind, the site provides an accessible gateway into the lab’s ecosystem—serving academic visitors, collaborators, and prospective partners alike.
🌐 Live Site  🔗 GitHub Repo
notion image

Problem Statement

Prior to development, the lab lacked a central online space to document:
  • Ongoing and completed research projects
  • Faculty and contributor details
  • Departmental updates and announcements
  • Media and gallery content from lab activities
This site addresses those gaps by providing a single, cohesive platform that supports scalability, responsiveness, and content clarity.

Tech Stack

Layer
Technology
Markup
HTML5 – Semantic web structure
Styling
Tailwind CSS – Utility-first CSS
Scripting
Vanilla JavaScript – Interactivity
Hosting
Netlify – Static deployment

Folder Structure


Core Features

✅ Static-Site Architecture

  • No backend dependency
  • Quick load times, simple deployment

📱 Responsive Layout

  • Built mobile-first with Tailwind CSS
  • Consistent experience across all screen sizes

🧠 Faculty & Project Portfolio

  • Individual sections for research contributions
  • Filters for ongoing vs. past projects

🖼️ Dynamic Image Gallery

  • Organized event highlights and lab walkthroughs

📩 Form Interfaces

  • Project submission and contact pages
  • Future-ready for backend integration

📈 SEO Optimization

  • Integrated sitemap and Google verification

Development Highlights

  • Minimal external libraries for performance
  • CDN Tailwind build for lightweight styling
  • Semantic HTML for accessibility and indexing
  • JS enhancements for smooth user interaction

Future Enhancements

Feature
Status
Details
CMS Integration
🔜 Planned
Backend support for dynamic project/faculty updates
React/Next.js Migration
🧪 Researching
Conversion to component-based framework for scalability
Analytics
🔜 Planned
Track user interaction and page performance
Multilingual Support
🔜 Planned
Add internationalization (i18n) for global visibility
Enhanced Forms
🔜 Planned
Connect to backend for form submissions and feedback handling

Impact & Vision

✅ Improves visibility and outreach of LIMSTIR’s work ✅ Provides a transparent overview of ongoing and past research ✅ Designed for long-term scalability without infrastructure overhead ✅ Simplifies communication and engagement with external stakeholders
The LIMSTIR website reflects how modern frontend development can effectively amplify academic and industrial research for a global audience—combining simplicity, speed, and structure.

Let me know if you'd like a one-page PDF version or portfolio snippet too.
Table of Contents
IntroductionProblem StatementTech StackFolder StructureCore Features✅ Static-Site Architecture📱 Responsive Layout🧠 Faculty & Project Portfolio🖼️ Dynamic Image Gallery📩 Form Interfaces📈 SEO OptimizationDevelopment HighlightsFuture EnhancementsImpact & Vision
limstir-dtu/ ├── index.html // Home landing page ├── about.html // Lab overview ├── contact.html // Contact form and lab details ├── form.html // Project submission interface ├── gallery.html // Media and event photo gallery ├── newProject.html // Ongoing research ├── pastProject.html // Archive of completed projects ├── project.html // Project templates ├── team.html // Faculty and researchers ├── sitemap.xml // SEO sitemap ├── google*.html // Google site verification ├── Ads.txt // Ad transparency // Static assets ├── css/ │ └── tailwind.css // Tailwind build/custom styles ├── js/ │ └── main.js // Navigation/form logic ├── img/ // Logos, banners, gallery assets ├── font/ // Custom font files