Enter Password
Designed and built a responsive corporate website for a growing Japanese interior design firm, establishing its first official digital presence and creating a platform to communicate its expertise and showcase its work.
June ~ August 2022
UX/UI Designer
Web Developer
株式会社D・アクティブ
(D active)
Figma
Zoom
Notion
Webflow
Visual Studio Code
Despite strong business growth and a growing client base, D Active lacked an official website, making it difficult to establish credibility with prospective clients. The challenge was to create a digital presence that communicated trust and professionalism while showcasing the company’s design expertise and growing portfolio.
Designed and built a responsive corporate website that introduces D Active’s identity, services, and expertise to prospective clients. The design uses the existing brand colors and large project imagery to create a professional first impression and put the company’s portfolio at the center of the experience.
I interviewed the CEO to understand the company’s goals, target audience, and constraints. A key finding was that, despite a diverse and growing client base, the lack of an official website made it difficult to establish credibility with prospective clients.
This shaped two design priorities:
01 Establish a more modern digital presence
Refresh the visual direction while staying aligned with the existing brand.
02 Demonstrate experience and capabilities
Use the portfolio and project content to build confidence with prospective clients.
I reviewed interior design and renovation websites to identify patterns in navigation, content structure, portfolio presentation, and visual design. These references helped inform the site’s information architecture and overall user flow.
I also explored color directions that built on the existing brand palette while giving the site a more contemporary feel.
Competitive references used to evaluate navigation, portfolio presentation, content structure, and visual direction.
Starting from an initial wireframe provided by the PM, I developed the homepage into a mid-fidelity concept, refining the layout and establishing the visual direction. I used the homepage as the foundation for stakeholder review, allowing us to align on the overall direction before extending the design to additional pages.
The client wanted the brand messaging to incorporate five “D” concepts, so I developed the tagline “Create Delightful Dreams with Direct Design Direction” to bring them together.
Client feedback indicated that the initial visual direction felt too subdued and lacked the “遊び心” they wanted to convey. In response, I introduced a brighter, blue-forward palette and expanded the key visual to better reflect the variety and energy of the client’s work.
Once the direction was approved, I extended the design across the remaining pages and mobile layouts, maintaining consistency in the visual system and responsive experience.
Homepage, before and after
Extending the approved visual direction across recruitment, case study, and news pages.
To strengthen credibility, I added client testimonials and expanded the project portfolio with tags for easier scanning. I also introduced imagery of the team and construction process, giving prospective clients greater visibility into the people and work behind each project.
After finalizing the designs, I built the initial site in Webflow before handing it off to a back-end engineer for WordPress implementation and final adjustments. I collaborated closely with the engineer throughout the handoff to maintain design fidelity and supported minor front-end adjustments as needed.
Working across both design and development gave me a stronger understanding of implementation constraints and allowed me to make design decisions with feasibility and technical requirements in mind.
The website launched as D Active’s first official digital presence, giving prospective clients a central place to understand the company, explore its services, and view its portfolio.
This project reinforced the importance of proactive communication across both clients and engineering teams. Establishing alignment early and translating feedback into clear design decisions helped reduce ambiguity and unnecessary revisions. Working closely with engineering throughout implementation also helped maintain design fidelity and resolve technical considerations during handoff.
What I would improve
With more time, I would introduce more structured design reviews and documentation earlier in the process to create clearer feedback loops and make the transition from design to development more efficient.
© 2026 Crystal Ma. All rights reserved.