Target Audience
- Potential Clients and Customers:
- Industry Partners and Suppliers
- Employees and Job Seekers
- Investors and Stakeholders
- Government and Regulatory Bodies
- Media and Press
- General Public and Community
Back to Portfolio
Case Studies
Product design is a dynamic and multifaceted discipline that blends aesthetics, functionality, and innovation to create products that enhance users' lives and experiences. Through a meticulous process of research, ideation, prototyping, and iteration, product designers transform concepts into tangible solutions, addressing both practical needs and emotional desires.
Striking a delicate balance between form and function, product design continually evolves to adapt to emerging technologies, societal trends, and user preferences, shaping the way we interact with the world around us and defining the landscape of our everyday lives.
Possible Solution
To address the challenges faced by Hindusthan Shipyard Limited (HSL), the website redesign will focus on creating a modern and visually appealing design that aligns with the company's brand identity, simplifying the navigation structure to enhance user experience, and ensuring full mobile responsiveness to cater to all device users. This includes reorganizing content to make important information easily accessible, integrating a search functionality for quick information retrieval, and conducting thorough usability testing to refine the design based on user feedback. By implementing these solutions, the redesigned website will improve user engagement, reduce bounce rates, and effectively communicate HSL's capabilities and services to its stakeholders.
The Approach
For the Hindusthan Shipyard Limited (HSL) project, the approach will involve conducting comprehensive design research to understand the needs of various stakeholders, including clients, partners, employees, investors, and the general public. We will start with user surveys and usability testing on the current website to identify pain points and areas for improvement. Based on these insights, we'll create wireframes and high-fidelity prototypes focusing on a modern, intuitive design that enhances navigation and accessibility. Ensuring full mobile responsiveness, we will implement a streamlined content organization and robust search functionality. The design will undergo multiple iterations based on user feedback to ensure optimal usability and satisfaction, ultimately delivering a website that effectively represents HSL's brand and services while meeting the needs of its diverse audience.
My Role
Design Strategy
Problem Solution
Information Architecture
Empathy Mapping
Usability Testing
User Flow
Prototyping
Wireframes
Competitive Analysis
Visual Design
User Research
User Persona
Problem Statement
Hindusthan Shipyard Limited (HSL) faced significant issues with its outdated and non-responsive website, which failed to reflect the company's modern capabilities and hindered user engagement. Users struggled with poor navigation and inefficient content organization, making it difficult to access crucial information quickly. Additionally, the lack of mobile optimization led to a subpar experience for users on smartphones and tablets. These problems collectively resulted in low user satisfaction and engagement, adversely affecting HSL's ability to effectively communicate with its stakeholders and showcase its services. The objective is to redesign the website to create a modern, user-friendly, and mobile-responsive platform that enhances user experience and effectively represents HSL's brand and services.
Project Timeline
UX Design
UI Design
Strategy
(Research)
Paper
Wireframes
Interview, Empathy Map,
User Journey Map
Visual Design
& Prototyping
Problem Statement &
Goal Statement
Usability
Testing Phase
Competitive Analysis &
Information Architecture
1st
Week
2nd
Week
3rd
Week
4th
Week
5th
Week
6th
Week
7th
Week
8th
Week
9th
Week
10th
Week
11th
Week
12th
Week
Emphatize Phase
Qualitative Research
Qualitative research for Hindusthan Shipyard Limited (HSL) involves conducting in-depth interviews, focus groups, observational studies, and usability tests to gain deep insights into stakeholder perceptions, behaviors, and needs related to the current website and its redesign. By exploring user experiences, preferences, and challenges through open-ended questions and direct observations, the research aims to uncover nuanced insights that inform a user-centered approach to improving website navigation, content accessibility, visual design, and overall user experience.
Interview Questions
For Vendors
- How do you currently engage with HSL regarding procurement and partnership opportunities?
- What information or resources do you typically seek on the HSL website when considering collaboration?
- What are the key factors that influence your decision to partner with a shipyard like HSL?
- In what ways could the HSL website better facilitate communication and information exchange between suppliers and the shipyard?
- What improvements would you suggest to enhance the procurement process and transparency on the website?
For Employees
- How would you describe the current effectiveness of the HSL website in communicating the company's capabilities and services?
- What feedback have you received from clients, partners, or other stakeholders regarding their experience with the website?
- Are there specific areas of the website's navigation or content organization that you believe could be improved?
- How does the website currently support internal processes such as HR communications, news updates, or corporate announcements?
- From your perspective, what are the key goals or objectives that the redesigned website should achieve?
General Questions
- How often do you visit the HSL website, and for what specific purposes?
- What do you find most valuable about the current website, and what aspects do you find least helpful?
- Can you share a recent positive or negative experience you had while navigating or using the HSL website?
- How does the website compare to competitors or industry standards in terms of usability, design, and content?
- What suggestions or recommendations would you have for improving the overall user experience on the HSL website?
Key Insight Derived
Navigation Complexity: Users frequently encounter challenges with the current website's navigation, finding it complex and difficult to locate specific information such as services offered, project details, and contact information. Simplifying and streamlining navigation emerged as a top priority.
Mobile Usability: Mobile users, including clients and vendors, face significant usability issues due to the website's lack of responsiveness and slow loading times on mobile devices. Enhancing mobile optimization is essential to improve accessibility and user experience across all devices.
Content Accessibility: Stakeholders expressed a need for clearer and more organized content presentation. Important information is currently buried deep within the site, making it hard for users to find relevant details quickly. A structured and searchable content layout is essential for facilitating efficient information retrieval.
Visual Design and Brand Representation: The outdated visual design of the current website does not align with HSL's modern capabilities and industry standards. Stakeholders emphasized the importance of a visually appealing and professional design that reflects HSL's brand identity as a leading shipyard.
Communication Effectiveness: There is a strong consensus among stakeholders regarding the need for improved communication channels and transparency on the website. Clear and accessible contact information, along with responsive communication channels, are critical for fostering trust and facilitating business interactions.
User Engagement and Interaction: Stakeholders value interactive elements and engaging features that enhance user experience and encourage exploration of the website. Incorporating interactive tools, client testimonials, and multimedia content can significantly enhance user engagement and satisfaction.
Empathy Map
Says
I need easy access to tender details.
How can I track my application?
I want to connect with the right department quickly.
Thinks
Is this information reliable and up-to-date?
Is this process secure?
Will I get timely updates on my application or tender?
Does
Logs in to the employee portal for payroll or attendance tracking.
Searches for current tenders.
Applies for a job opening.
Uses the "Contact Us" feature to ask a question or report an issue.
Feels
Feels confused if the navigation isn't intuitive.
Feels frustrated if there's no clear status tracking for tenders or job applications.
Feels relieved when support is easily accessible.
Feels satisfied when tasks are completed smoothly and promptly.
Design Thinking Process
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Emphatize
User ResearchUser InterviewEntrant Analysis
Define
User PersonaUser Jouney MapGoal StatementEmpathy Map
Ideate
BrainstormingCard SortingUser Flow
Design
Paper WireframesVisual DesignPrototype
Test
CheckUsabilitySurvey InsightImprovements
Visual Design
Define Phase
User Persona
User Persona 1
- Name
- Rakesh Sharma
- Age
- 39
- Occupation
- Business Owner (Engineering Supplies)
- Location
- Mumbai, India
Brief Story
Rakesh Sharma, a successful business owner from Mumbai, is eager to expand his engineering supplies company by securing tenders with Hindustan Shipyard Limited (HSL). However, he struggles with the HSL website's complex navigation, slow tender updates, and unclear submission processes. Rakesh's primary goal is to streamline the bidding process, allowing him to efficiently manage tenders and track their progress in real time. Winning more contracts with HSL would significantly grow his business, and he is motivated by the prospect of more efficient tender management.
Goals
- Successfully bid for tenders on the HSL website.
- Easily track the status of submitted tenders.
- Receive timely notifications about new tenders and bidding deadlines.
Frustrations
- Difficulty in finding current tenders quickly.
- Lack of clear, real-time updates on tender status.
- Complicated documentation upload process during tender submission.
Needs
- A simplified tender submission process.
- Clear guidelines and step-by-step instructions for bid submission.
- Easy access to tender history and updates.
Motivations
- Expanding his business by securing large-scale contracts.
- Ensuring that his company stays competitive in the industry.
- Winning more tenders efficiently without wasting time on administrative tasks.
User Persona 2
- Name
- Meera Patel
- Age
- 27
- Occupation
- Mechanical Engineer
- Location
- Visakhapatnam, India
Brief Story
Meera Patel, a mechanical engineer from Visakhapatnam, is keen to secure a job at Hindustan Shipyard Limited (HSL) but finds the application process difficult to navigate. The website's recruitment section is confusing, and the lack of communication after submitting her application leaves her anxious. Meera's goal is to land a stable engineering job, but she feels disconnected and frustrated by the unclear process. She wishes for a more transparent and responsive system that keeps candidates informed at every step, motivating her to pursue her career aspirations.
Goals
- Find and apply for relevant job openings at HSL.
- Track the status of her job application.
- Understand the company's recruitment process and timelines.
Frustrations
- Difficulty navigating the recruitment section of the website.
- Lack of clear information on the status of her job application.
- Slow response times to inquiries regarding her application.
Needs
- A user-friendly application process with all steps clearly outlined.
- Immediate acknowledgment and regular updates after submitting an application.
- Easy access to FAQs or contact information for recruitment-related queries.
Motivations
- Securing a stable and well-paying job in a reputed organization.
- Finding a job that aligns with her engineering background.
- Receiving prompt communication and updates to reduce anxiety about her application status.
Information Architecture
Typography & Colors
Font Used
Nato Sans
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
1234567890
Satoshi font is a elegant and modern sans serif font. It is very neat and clean. It have more readability and variety of options. That's why I used this font.
Nato Sans
Nato SansG
Nato Sans
Nato Sans
Color Used
Primary Color
#2947a3
Secondary Color
#fff3f4
Text Color
#150202
Text Color
#595959
Bg Color
#f3f3f3
High-Fidelity Designs