Mise en place, establishment
To build a kick-ass frontend, we rely on each other: Designers on developers, and developers on designers. “By staying on the cutting edge of both design and technology, “Front” evolved to be the largest web conference in Switzerland.”
Key takeaways
Conventional comments
One of the most influential tools in 2022 has became Conventional comments that encourage devs to read and write feedback in a better way and having a better quality of reviews, link to the website: https://conventionalcomments.org/ created by Paul Slaughter.
Static builds
Astro smart build system are usually compared with next.js based on similarities, but unless it overcomes barrier of competitor trade-offs the both frameworks has it’s down sides. Bundle script size isn’t comparable, because of the full or partial hydration, building components as a small applications that lazy load the script as an entry point based on its reference, makes it a performance-first static rendering.
Astro compiler has been built with Go and runs with node.js. Link to the website https://astro.build/
Differentiation between rendering strategies as static or server side nor interception of routing isn’t available in comparison with next.js, but building multi or single page applications fully static brings several advantages, as SEO tagging, product pages are accessible to web crawler in html format rather than a snapshot from a script that is typical to one-entry point bundlers, limiting double rendering from server to client, decreasing the bundle size more than 10times, and supported with typescript compiler.
CSS in 2022 has fully or partially available features that attempt solving the overlooked questions in CSS, such as select, grid, imports, color spaces and color contrast, browser support https://caniuse.com/
From the experience of one of the speakers who has built a design system to provide thousands of insurance claim form across different countries:
Do not follow a Spotify model, people are not getting cloned. Spotify model is a people-driven, autonomous approach for scaling agile that emphasizes the importance of culture and network.
Invest in tools & processes that makes user experience better.
Evaluate support from organization and cost of the maintenance.
Find a dedicated people squad who are willing to invest time in efficiency that is quality and accessibility of design system.
Do not mention atomic design without a context.
Follow community based design systems that involves end-users and user testing.
Investing in product means finding the right specialists (devs), generalists (designers), and principals who brings all together (product owner,) by advocating for the users, understands organizational needs and development process.
Design leadership must be the anchor in the teams in order to balance which users needs are more important than others.
Before building a design system, structured must form early as part of common code and design kits, that includes style guide and consistent branding.
Design process must be functional and interactive, not fully based on image and sketches. High fidelity mockups make complete image blueprint of the website but usually isn’t complete within a full context and interactivity.
From perceptional to functional wireframes, teach designers how coding holds the design.
Establish consistent, token based development to align the process, limit the code and infinite flexibility for a handover.
Ensure the consistency with repetitive UI/UX from design to dev commons.
Design systems are categorized not only as interface based but a full stack functional interfaces, built with rest APIs, third-party libraries or microservices.
Docs aren’t optional, it doesn’t have to be monolith or an archive but consistent. Docs are UX for the developers.
