Web Design
Web Design
Web Design
No-Code Website Building
No-Code Website Building
No-Code Website Building
Animations
Animations
Animations
GLSoft - Corporate Official Website
GLSoft - Corporate Official Website
GLSoft - Corporate Official Website
GLSoft is a software technology company specializing in SAP eCommerce platform development, AI, and ML solutions. Their client includes major eCommerce brands like Watsons. However, However, the outdated website led to a poor user experience and weakened brand perception. The goal of this redesign was to modernize the website, creating a professional and user-centric corporate presence that effectively showcases GLSoft’s expertise while ensuring users can easily understand and connect with the brand’s value.
GLSoft is a software technology company specializing in SAP eCommerce platform development, AI, and ML solutions. Their client includes major eCommerce brands like Watsons. However, However, the outdated website led to a poor user experience and weakened brand perception. The goal of this redesign was to modernize the website, creating a professional and user-centric corporate presence that effectively showcases GLSoft’s expertise while ensuring users can easily understand and connect with the brand’s value.
GLSoft
GLSoft is a software technology company founded in 2020, focusing on the full-stack construction of international large-scale SAP e-commerce platforms, as well as the development of artificial intelligence and machine learning. Major clients include cross-border e-commerce companies such as Watsons.
GLSoft is a software technology company founded in 2020, focusing on the full-stack construction of international large-scale SAP e-commerce platforms, as well as the development of artificial intelligence and machine learning. Major clients include cross-border e-commerce companies such as Watsons.
Project Information
My role: Solo designer, includes self-built Framer website
Duration: 2 months, 2024/06 - 2024/07
Tools: Figma, ChatGPT3.5, Framer
My role: Solo designer, includes self-built Framer website
Duration: 2 months, 2024/06 - 2024/07
Tools: Figma, ChatGPT3.5, Framer
The appearance of the user and the user's goals
Target user
Target user
A technical director at a retail company, aged 35-50, who is cautious, conservative, and organized. He is responsible for ensuring that the company's engineering infrastructure and applications operate efficiently.
A technical director at a retail company, aged 35-50, who is cautious, conservative, and organized. He is responsible for ensuring that the company's engineering infrastructure and applications operate efficiently.
The purpose of using the website
The purpose of using the website
When users visit the company website, they will review information such as the company introduction, professional fields, service content, and client cases, to assess the possibilities and value of collaboration
When users visit the company website, they will review information such as the company introduction, professional fields, service content, and client cases, to assess the possibilities and value of collaboration
According to the user's purpose, transform the focus of the website into visual content.
Based on the user's purpose for using the website, I have summarized the core focus of the website into three main parts, and corresponding it into specific web presentations and content to ensure that the website meets business needs while also providing a good experience for users.
Based on the user's purpose for using the website, I have summarized the core focus of the website into three main parts, and corresponding it into specific web presentations and content to ensure that the website meets business needs while also providing a good experience for users.
Website Highlights
Professionalism and reliability
Professionalism and reliability
Professionalism and reliability: Since the target users are professionals such as corporate technology executives and engineering project managers, the website design should showcase the company's professionalism and reliability.
Professionalism and reliability: Since the target users are professionals such as corporate technology executives and engineering project managers, the website design should showcase the company's professionalism and reliability.
Demonstrate technical solutions
Demonstrate technical solutions
Users are concerned about technical solutions, so the website design should showcase the various engineering-related services or technical analysis provided by the company.
Users are concerned about technical solutions, so the website design should showcase the various engineering-related services or technical analysis provided by the company.
Easy to navigate and quick to browse
Easy to navigate and quick to browse
Senior executives often have limited time, and they want to quickly find the information they need.
Senior executives often have limited time, and they want to quickly find the information they need.
Screen content
Use clear layouts, genuine photos, professional fonts, and a serious color scheme, as well as content that showcases the company's strength, such as client cases, success stories, and partners.
Use clear layouts, genuine photos, professional fonts, and a serious color scheme, as well as content that showcases the company's strength, such as client cases, success stories, and partners.
For front-end and back-end development, system maintenance, etc., clear service descriptions, technical articles, or case studies can be presented.
For front-end and back-end development, system maintenance, etc., clear service descriptions, technical articles, or case studies can be presented.
A clear navigation structure and fast loading speed to ensure that users can quickly find the information they need.
A clear navigation structure and fast loading speed to ensure that users can quickly find the information they need.
UI interface
In order to emphasize the professional image and brand value of the company, the visual design focuses on creating clear visuals with a well-defined information hierarchy. The website integrates subtle interactive elements to enhance user engagement, and through clear copy, allows users to quickly obtain the information they need, thereby improving the website's user experience.
In order to emphasize the professional image and brand value of the company, the visual design focuses on creating clear visuals with a well-defined information hierarchy. The website integrates subtle interactive elements to enhance user engagement, and through clear copy, allows users to quickly obtain the information they need, thereby improving the website's user experience.
Home
Our Team
Join Us
Learning and reflection
Replace the photos in the Moodboard with specific website screenshot examples.
Replace the photos in the Moodboard with specific website screenshot examples.
During the back-and-forth process of this project, I realized that when communicating the "style and design direction," using specific website design examples can help the team and the stakeholders visualize the final presentation of the website more accurately than just using photos from the mood board.
During the back-and-forth process of this project, I realized that when communicating the "style and design direction," using specific website design examples can help the team and the stakeholders visualize the final presentation of the website more accurately than just using photos from the mood board.
The design and development tools should pay attention to the method and limitations of conversion.
The design and development tools should pay attention to the method and limitations of conversion.
Although Framer has great advantages in interactive prototyping, it cannot completely replace Figma in design details; in the future, the development platform should be decided at the beginning of the project. Understanding how no-code tools integrate with the main design tools can allow for more flexible adjustments to the tool usage strategy, ensuring a smooth design process.
Although Framer has great advantages in interactive prototyping, it cannot completely replace Figma in design details; in the future, the development platform should be decided at the beginning of the project. Understanding how no-code tools integrate with the main design tools can allow for more flexible adjustments to the tool usage strategy, ensuring a smooth design process.
Write down the purpose of using dynamic effects, and pay attention to the balance with user experience.
Write down the purpose of using dynamic effects, and pay attention to the balance with user experience.
Dynamic effects are indeed eye-catching, but they can also divert the user's attention. This time, I tried many effects and ultimately chose those that could help convey a sense of professionalism for the brand. In the future, when arranging effects, it would be beneficial to note the purpose of using dynamic effects and how they align with the brand's characteristics to enhance the overall website user experience.
Dynamic effects are indeed eye-catching, but they can also divert the user's attention. This time, I tried many effects and ultimately chose those that could help convey a sense of professionalism for the brand. In the future, when arranging effects, it would be beneficial to note the purpose of using dynamic effects and how they align with the brand's characteristics to enhance the overall website user experience.
Other projects
Other projects
