BSR Fire & Safety Institution
Bobbili Srinu, widely recognized as BSR, is a prominent BJP politician and MLA Aspirant also the proud owner of BSR Fire and Safety Institution. He reached out to me as a client through a close mutual connection to discuss a redesign for his institution’s website. Embracing it as an exciting challenge, I worked diligently to meet and exceed his website needs and expectations.
About The Institution
BSR Institute, recognized by the government with ISO 2015 certification, offers top-quality fire safety courses in India. With branches in key districts, including Vizianagaram, Visakhapatnam, Vijayawada, Hyderabad, and Odisha, it’s a leader in SBTET Industrial Safety courses in Andhra Pradesh and Telangana. These courses enhance core competencies, skills, and safety knowledge, aligning with industry standards. Graduates possess strong analytical and interpersonal skills, contributing to a safer work environment.
Company NAME
Project Timeline
Project Type
Country
The Challenge
Alright, here’s the lowdown on the website situation. It’s been around for a solid 12 years, but it’s basically stuck in the past. Students are struggling, especially on mobile, because it’s about as responsive as a brick wall. And don’t even get me started on how tough it is to read the info on there!
Now, the client’s dishing out some ideas for a makeover:
- They want this thing to stand out big time, like light years ahead of the competition.
- It's gotta get that industry nod of approval, you know what I mean?
- Oh, and they're all about splashing their brand colors all over the place.
- Students should be able to grab course info without breaking a sweat.
- And, of course, it needs to be smooth on all devices and SEO-friendly.
My Solution
So, here’s the scoop after my bug-hunting mission. I sat down for a chat with some of their old students to tap into their website experience and see what they’re hoping for. After diving into this research and listening to the client, here’s what’s cooking:
- I went all detective on the competition, finding ways to give their website a major facelift.
- Made a handy list of slick websites in their league for some creative inspiration.
- I dabbled in a bit of color mixing and matching, finding the shades that really sync up with their style, with a little input from the client.
- Cooked up a website that's best buddies with search engines and plays nice on every device in the galaxy.
Tools I used
Figma
Miro
Photoshop
Elementor
WordPress
My Roles
Visual Designer
User Researcher
User Flow
Empathy Mapping
Usability Test
Wireframing
Prototyping
Responsive Design
Previous Website Version
When BSR Sir called me, I was excited and told him, “I’ll revamp your website to make it student-friendly.” The moment I saw their website, I knew it needed some serious upgrades. BSR Sir wanted to keep the colors and fonts the same, but he left the rest to my creative choices. Before you dive into the website I crafted, check out how it looked before.
User Centered Design Process
Throughout every stage of the design process, I emphasized user-centricity, a principle known as User-Centered Design (UCD). Within this framework, I applied various research and design methodologies to actively engage users, ultimately yielding a website that is both highly usable and accessible to them.
Discovered
- Design Strategy
- Market Strategy
- Competitor Analysis
Describe
- User Research
- User Persona
- Data Gathering
Ideate
- Brain Storming
- User Flow
- Content Architecture
Design
- Wireframing
- Prototyping
- Visual Design
Project Timeline
The primary aim of design is to deliver an improved product that aligns with user requirements and preferences, enhancing its market appeal.
Style Guide
User Persona
I’m so excited to be redesigning the website! I interviewed students, alumni, and management to get their feedback on the current website and their hopes for the new one. It took about 3 hours, but it was totally worth it. Everyone was so patient and helpful, and they’re all really excited about the new website. Now it’s time to start designing! I’m going to take all of their feedback into account and create something that everyone can be proud of.
Empathy Mapping
User Research
Students want to know everything about a institution before they apply. They want to know about the institution's history, its academic programs, its faculty, and its campus life. They also want to know about the institution's job placement rate and the companies that hire its graduates. And of course, they want to be able to access all of this information on any device, at any time.
Site Map
Wireframes
Revamping this website has been a bit of a puzzle, to be honest. I’ve been in cahoots with the institution management, gathering everything from nitty-gritty course details to info on our star alumni. Once I had all the ammo I needed, I got down to business and started sketching out the basics on MIRO. So, without further ado, here are the website’s blueprints. Check ’em out!
Shazaaam! I honed all the details based on client input and teamed up with developers for a seamless launch and an ongoing wave of awesomeness post-launch.
Final Website Outcome
I had a blast giving our political bigwig’s project a fresh makeover. All those pesky bugs from the old version? Gone, vanished! Now, our website’s looking sharp and ready to take on the competition. Plus, it’s so user-friendly that even a 5th-grader could breeze through it.
- Easy Navigation: Made it more user-friendly for students
- SEO & Device Friendly Website
- Clear CTA buttons throughout the website.
- Institute management were able to generate 84 admissions in 45 days
