






And now, this is my solution. - click this!














radius go?
icons
You might feel like you’ve seen this kind of a style from somewhere and you’re probably not wrong. This is the 2022 WWDC Apple Slideshow aesthetic. They too probably “inspired” it from somewhere else, but they definitely did popularize it among many designers and companies making it a “trendy” web design format. When I actually sat through the original MyUPES portal the other day, I really felt a similar style of arrangement in it. I don’t know if they were actually going for this(probably not) but I decided to stick with it and exaggerate that a little. This here, isn’t a serious attempt at redesigning the page, but is a caricature of it, of what I think it wants to be, of what it can be. Not to say that my process wasn’t serious at all though. I have tried to employ all the design principles that I know and have tried to make it a little bit better, a bit more user-friendly - both UX wise and feature wise, at least for me.
And from here👇, I shall explain myself thoroughly...









Webinars
Achievers
Student Stories
Events
Gallery

Dussehra
Midsem exam 1st Sem/Start
Midsen exam 3rd Sem/End
Midsem exam 1st Sem/End
Diwali Break/Start
Diwali Break/End
05
06
15
22
24
28


Due Today - Assignment 5
27/12/2022
Due Today - Assignment 4
27/12/2022
Overdue - Assignment 3
27/12/2022

Class commencement scheduled for B.Tech/ BA/ B.Com/ BSc/ MCA/ MSc/ Integrated BBA – MBA/ Integrated BCom - MBA/ MA/ B.Pharma/ Msc/ Integrated BSc-MSc/ Integrated B.Tech-MBA
Scholarship Policy
SRE - Requisition Formats
Counseling form for NC students
Examination Notification

Dr. Sunil Rai, VC





New notification icons and redirect buttons.
figure and ground

Links more emphasized with underlines and arrow icons.
New logos.

Due Today - Assignment 5
27/12/2022
Due Today - Assignment 4
27/12/2022
Overdue - Assignment 3
27/12/2022
Live
BlackBoard
notifications.
Red, Green &
Blue.
Oh! forgot one thing, This cute little navbar!
Compact links, only the necessary ones, and if theres are any notifications, a simple green dot will indicate it for you.
Again, the Gestalt principles are employed thoroughly in the design where it is needed, and are broken well where it is not needed.
Figure & Ground is there under the “Welcome to UPES” text on the video, and under every single floating button.
Proximity is there amidst all the text links in the Sap Portal section and in the Notifications card.
Simplicity is seen when the user perceives the whole dashboard as a single unit, the all encompassing one, rather than as multiple elements in the initial viewing.
Similarity is also seen everywhere, text, with similar structure are perceived to have the same property(such as links). The arrow buttons are all perceived to have the same property even though they’re situated in multiple cards.
Common Region is seen in every single card, where the backgrounds make a distinction between the different cards but they group all the elements within itself.
For Symmetry, well, if we are gonna force it in, it can be seen in the book icon in the library card.
Closure can be seen in the fun little circles surrounding some text. Even though not fully connected, they appear so very much.
Common Fate, although not much here, can be seen in those little chips in the My Resources card. They seem to be giving the appearance of fading away as one group.
Element Connectedness, almost all of the UI is created using boxes and lines. From the nav bar to the background check pattern. Everything is using this connectedness principles and nests elements very nicely.
By this note, I’m concluding ,my assignment. But wait! There is a mock-up below to show you how all this would look like in the real world. I think it looks alright doesn’t it?