
This project was delivered to promote SoSoHanSotong’s “Easy Information Conversion” service and build a web page where users can experience the service directly. We implemented a real-time demo flow—from original text input to side-by-side comparison with the converted result—so users can understand the value of the service intuitively.
We applied accessibility-first UX/UI design for users who need improved information access, including older adults and people with disabilities. Accessibility factors such as color contrast, structural accessibility, and responsive UI were reinforced to a public-sector level. We also designed a brand-driven landing experience that reflects SoSoHanSotong’s service philosophy and identity, clearly communicating why the service is needed and how it can be used.
The client required a hands-on demo experience for the Easy Information Conversion service, including a structure that compares the original text and the converted result side by side. They requested practical controls to adjust writing style, information density, and readability, and asked for an experience designed to help users understand the service through direct interaction rather than a purely promotional page.
They also required accessibility-based UX/UI design that considers diverse users such as older adults, people with disabilities, and foreign users. Public-sector-level accessibility checks—such as color contrast, structural accessibility, and alternative text—were requested. In addition, the client required a responsive structure that delivers a consistent experience across PC, mobile, and tablet environments, with cross-browser support to prevent display issues in certain browsers.
Finally, they requested user-friendly guidance and examples to improve understanding of how Easy Information is converted, including sections such as usage guides and conversion examples. They also asked for a simplified inquiry flow with a single CTA on the inquiry page linked to Google Forms, and an intuitive structure for browsing FAQs.
We established a single landing flow that connects service introduction, conversion examples, hands-on demo, and inquiries. A set of “six original-text type examples” was provided to help users understand the conversion approach through concrete scenarios.
We implemented a real-time Easy Information Conversion demo, including a side-by-side comparison view between the original text and the converted result. Controls were provided to adjust writing style, information amount, and readability, and utility features such as copy and reset were implemented for a smoother experience.
To support accessibility validation, we built a dedicated “Web Accessibility Demo” tab and implemented checks for color contrast, structural accessibility, and alternative text. We also delivered responsive web development optimized across PC, mobile, and tablet, using a media-query-based responsive structure and optimizing scripts and images to improve page load performance.
In addition, we built a design system and common components, documenting color palettes, typography, and reusable UI elements such as buttons and input forms, and created style guidance that maintains a consistent brand tone. For stability and security, HTTPS communication was applied, anti-spam measures and input validation were implemented, and key pages were tested for load with error logs monitored.
