IMSciences student portal
A student portal prototype for IMSciences, Peshawar, rebuilt around what students do most: checking grades, paying fees, following their schedule and reading notices.
- Client
- Institute of Management Sciences (IMSciences), Peshawar
- Industry
- Education
- Year
- 2025
- Services
- UI/UX Design, Web Development

01Overview
The Institute of Management Sciences (IMSciences) in Peshawar runs undergraduate and graduate programmes in computer science, artificial intelligence, business, economics, psychology and more. Hectagon designed and developed a modern student portal prototype for the institute, with usability and clear information architecture at its core.
02Challenge
University portals often feel like administrative databases. Grades, fees, timetables and notices sit on separate pages with different layouts, so simple questions such as "what do I owe?" or "how is my GPA trending?" take too many clicks to answer. The portal also had to scale to a large and varied student body.
03Approach
We applied human-computer interaction principles from the start, rather than restyling the existing screens.
Visibility: the answers students look for most sit on the dashboard
Consistency: every section uses the same layout, navigation and controls
Feedback and reduced load: clear states, due-date warnings and charts in place of long tables
04Solution
A responsive portal with a dashboard of quick actions (register courses, view grades, pay tuition, download transcript) and dedicated sections for everything else a student needs.
Grades: current and cumulative GPA, GPA progression, grade distribution and credits by semester
Transcript: academic summary and semester-by-semester results, ready to print or download
Finance: balance due, total paid, next due date, account status and payment history
Courses, assignments, schedule, attendance, library and prioritised announcements
05Architecture
Built with Next.js and deployed on Vercel, with Supabase as the database, so the prototype runs on real data rather than static mock-ups.
06Outcome
A working prototype that shows how the same academic information can feel like a companion for students rather than an administrative system.
07Key features
01
Student dashboard
Quick actions, GPA, credits, balance and this week's classes on one screen.
02
Grade tracking
GPA over time, grade distribution and current course grades.
03
Academic transcript
A full record by semester, with print and PDF download.
04
Financial dashboard
Dues, payments, deadlines and a balance trend chart.
05
Announcements
Notices with priority labels so urgent items stand out.
06
Light and dark mode
Comfortable to read at any time of day.
08Technology
- Next.js
- Supabase
- Vercel



