Designer Developer Collaboration

1 posts

figma2 min readCurated summary

Web design without a web designer? Xfive turns to Figma. | Figma Blog

Xfive, a web development company without in-house designers, used Figma to redesign its outdated website. Content producer Lubos Kmetko created the redesign and used Figma’s browser-based collaboration, prototyping, commenting, and developer handoff features to involve stakeholders across the company. The experience showed that Figma could make website design accessible to non-designers while reducing communication and implementation friction. ## Website problems and redesign goals - Xfive’s homepage and key sections had fallen behind as the company grew. - The site suffered from: - Outdated Customers and Work sections - Confusing navigation - Too many competing calls to action - Numerous landing pages that were difficult to maintain - Because Xfive typically implements client-provided designs, it did not usually employ dedicated designers. - Lubos Kmetko, a content producer familiar with Figma, took responsibility for the redesign. ## Prototyping and stakeholder collaboration - Lubos redesigned the homepage, Customers section, and Work section. - He streamlined navigation and reduced the number of CTAs and landing pages. - Stakeholders from marketing, sales, production, editorial, development, and operations reviewed the mockups. - Figma’s cloud-based workflow allowed anyone with a browser to: - Open the designs through a shared link - Leave comments - Discuss ideas and interactions - Review changes in real time - Feedback and revisions remained synchronized in one location instead of being scattered across files and messages. ## Improving designer-developer handoff - Approved designs were shared directly through Figma rather than sent as files through email or Box. - Developers could inspect designs in the browser using Code Mode. - Figma provided specifications such as dimensions, colors, and padding, along with export options for CSS, iOS, and Android code. - This reduced version-control problems, guesswork, and dependency on tools such as Avocode or Zeplin. - Developers reported that access to precise design details helped them code faster and more accurately. ## Future use of Figma at Xfive - Xfive viewed the redesign as a starting point for adopting Figma in client projects. - Lubos envisioned replacing emailed PDFs and JPEGs with functional, shareable prototypes. - The company planned to use Figma across the process, from early design discussions and implementation details to developer handoff. Figma enabled Xfive to complete a substantial redesign without a traditional designer and created a more centralized, collaborative workflow. For teams working across disciplines or locations, browser-based prototypes, comments, and inspectable design specifications can significantly simplify both design review and development.

Read original(opens in new tab)