21-Figma-APP项目实战概述

billycoder billycoder 博客等级 墨衍会员 · AI 创作全网分发 墨衍智能分发 本文由作者通过墨衍一键同步至各平台 1分发平台 300+累计阅读 397平均单平台 已同步平台 优快云 微信公众号 微博 知乎 掘金 百家号 博客园 抖音 小红书 你的文章也可以这样分发 墨衍会员 ¥399起/年，写一次发全网 我也要 码龄17年
关注
原创 2022-01-23 16:29:21 397 阅读 AI 写同款· GEO 优化 ›
39-Figma-APP套样机方法 39-Figma-APP套样机方法 透视效果的样机需要用Mockup Plugin 效果 1.社区找到样机,创建副本 2.复制画框到样机 3.套带透视效果的样机 搜索并创建副本 打开Free iPhone 12 Pro Mockup的副本,提供了how to use 安装Mockups 复制frame过来,选中想要的样机里面的屏幕部分,然后启动mockup,点击perspective 有个技巧,按住ctrl点击鼠标,可以选中最里面的图层 ... 阅读详情

21-Figma-APP项目实战概述

项目名称

在这里插入图片描述

包含页面

在这里插入图片描述

项目的开发过程

在这里插入图片描述

收录于
ui设计

当前文章被收录于：

ui设计
38 篇文章 27 人学习
订阅专栏 查看详情
标签
#css3 #前端 #css
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
34-Figma-项目组件库搭建与整理-组件命名规范-组件放置位置 34-Figma-项目组件库搭建与整理-组件命名规范-组件放置位置 1. 组件命名规范 页面/类型/具体名称 2.组件放到统一页面中 3.组件和实例之间跳转 4.组件共享 阅读详情

相关推荐

Figma 插件开发 - Vite 环境搭建

最近工作主要和 Figma 插件打交道，梳理一些踩坑的经验~ 开始 官方的起始例子：www.figma.com/plugin-docs… 按步骤将插件文件保存到本地即可，调试时可以右键唤起插件，可以关注下几个功能入口： Import plugin from manifest 导入本地插件 Open console 控制台调试 Run last plugin 加载最新的插件 目前 figma 插件开发流程没有有效的 hot reload 机制，【加载最新插件】在开发时比较常用，快捷键可以记一下。

小王的技术库 2467

从设计交付到开发，轻松畅快高效率！

一个优秀数字产品的发布是一个漫长且需要不断调整细节的过程，这需要设计师和开发者深度沟通合作。然而大多数团队会在沟通中的简单问题上花费大量的时间，例如: 字体是什么？间距是多少？内容如何拉伸？等等。通常是在邮件、聊天和错误清单里拷贝数值，这样并不高效。甚至会因为一开始错误的假设，导致在提交的最后一刻依旧争论不休。这就是令团队成员沮丧的设计交付问题 (The Handoff ...

Android开发者 965

Figma Auto Layout 进阶指南：混合布局、绝对定位与工程化实践

在UI设计与前端开发领域，响应式布局是实现跨设备适配与高效协作的核心技术。其原理是通过一套规则系统，自动计算并分配界面元素的空间与位置，从而提升设计稿的工程化水平与开发还原度。从技术价值看，它直接关联着设计系统的健壮性、组件的复用性以及团队协作效率。在应用场景上，无论是构建复杂的Web应用界面、移动端组件，还是设计系统中的原子模块，都离不开对布局逻辑的精准控制。本文聚焦于Figma Auto Layout的最新增强功能，如混合方向布局（Wrap/Grid模式）与绝对定位支持，这些更新正是为了解决传统布局在应

weixin_34319817的博客 420

Figma插件开发避坑大全，90%新手都会忽略的8个关键细节

掌握JavaScript Figma插件开发的关键细节，避开90%新手常犯的坑。涵盖插件架构设计、API调用陷阱、UI通信机制等8大核心问题，提升开发效率与稳定性。适用于界面自动化、设计资产导出等场景，值得收藏。

Instrustar的博客 868

Automotive Design Compose基础（一）-- Frame& Text

Design Compose 入门第一节，关于figma和Design Compose 的绑定， frame 和text两种基础控件的设置

J0erry的博客 861

Figma设计稿转移动端代码的落地实践：Jetpack Compose与SwiftUI半自动方案

Figma设计稿转代码并非简单的视觉映射，而是设计系统、平台规范与工程实践的深度协同。其本质是将Figma中的语义化变量、约束关系和状态逻辑，准确翻译为Jetpack Compose或SwiftUI等声明式UI框架可执行的类型安全代码。技术价值在于打破设计-研发信息断层，提升UI一致性与迭代效率；典型应用场景包括中大型App的设计系统落地、多端协同开发及CI/CD驱动的UI自动化交付。本文聚焦Figma变量体系与移动端Theme的精准映射、约束到Modifier/SwiftUI布局的降维表达、以及可验证半自

weixin_34296641的博客 376

Figma-ui设计学习APP Store

打开标尺，设置左右内边距参考线（左21 右356），win:按住ctrl放大标尺。shift+R 显示或隐藏标尺。点击圆形框右击-插件-avadar 会自动插入图片。头像创建-快捷键：O，大小为4的倍数，32/28。按L键画条直线，修改颜色：0、0、90；添加投影：模糊40，y轴8，透明度15。打开浏览器安装扩展，解压加载进去即可。设置蒙版 ctrl+Alt+M。按R键，创建一个矩形，添加圆角。选择Chorme汉化版离线包。去社区安装插件：avatar。添加蒙版去除不需要的部分。

qq_48150274的博客 1044

移动端UI设计避坑指南：从Figma到上线，这些细节90%的设计师都忽略了

本文详细解析移动端UI设计从Figma到上线的常见陷阱，涵盖触控交互优化、视觉层次维护、动效设计原则等关键细节。特别针对设计师容易忽略的触控区域设置、多态组件状态管理、开发交接规范等核心问题，提供Figma实操技巧和真实案例解决方案，帮助提升移动应用用户体验和开发效率。

weixin_30892037的博客 401

零成本UI设计革命：Pencil Project如何逆袭Figma？

你还在为Figma的订阅费用发愁吗？团队协作时总被云端依赖卡住进度？作为产品经理，你是否需要一款既能离线工作又支持多平台原型的设计工具？本文将深入对比开源原型工具Pencil Project与商业巨头Figma的核心能力，用实测数据告诉你如何用零成本完成专业级UI设计。读完本文，你将掌握：开源工具替代商业软件的具体场景、Pencil Project 3.1.1版本的10大功能突破、跨平台原型设计的

gitblog_00697的博客 1904

Claude Code × Figma：高保真设计还原的完整工程指南

2026 年，设计到代码的赛道挤满了工具。这不是随机的运气，而是 Claude Code 对 Figma 设计语义深层理解的直接结果。当其他工具把 Auto Layout 扁平化为加一串 magic number 时，Claude Code 会识别出"这是一个 HStack/VStack 容器"，然后生成能够响应设计变更的代码——当 Figma 中的方向从 HORIZONTAL 切到 VERTICAL 时，只需改一处父级方向，而非逐项调整子节点。

篮球界最会写bug的人；程序猿中打球最菜的人。 349

接上篇，记录一下【Unity 3D对博途PLCSIM的通讯】文章有点长~仔细看，很基础

本文参考链接：西门子PLC丨PROFINET通讯仿真（虚拟通讯）做了一些更详细的优化，本文使用的类库并非原作者使用的类库。 首先，昨天项目已经创建好了，这边也加了一个InputField和一个Button，可以实现简单的读取，ok开始。 放入准备好的通讯类库； 新建一个博途的项目，本次测试使用博途V15，测试环境为虚拟机，Unity运行在本地计算机，建立博途项目流程如下： 新建项目，右键项目-属性-保护-对勾，如图： 不得不说的是，仿真中加密的FB块是无法下载的哦~ 添加CPU...

NS_Speak（IVAV） 8066

Material UI Sync 实战指南：从 Figma 设计令牌到 Material UI 主题代码的生成流程

Material UI Sync 是 Material UI 官方推出的 Figma 插件，能够将 [Material UI for Figma Design Kit](https://link.gitcode.com/i/d148320837868ac9e07a14b5c9239b64) 中定义的设计令牌（Design Tokens）与组件定制，直接转换为可粘贴进 `createTheme` 的

gitblog_00305的博客 723

ERA5数据驱动WRFV4.4实战：单层嵌套配置与关键报错排查指南

本文详细介绍了使用ERA5再分析数据驱动WRFV4.4模式进行单层嵌套模拟的完整实战流程。内容涵盖从数据精准下载、WPS前处理配置、WRF核心参数设置到高频报错的深度排查与解决方案，旨在帮助初学者在有限服务器资源下，高效完成WRF模拟并规避常见陷阱。

q5r6s7的博客 770

Understand-Anything /understand-figma：把 Figma 文件变成 kind:“design“ 知识图谱的设计与实现

本文基于 Understand-Anything 仓库中已批准的 Figma 基础设计规格（`docs/superpowers/specs/2026-06-24-understand-figma-foundation-design.ko.md`，其英文原文为 `docs/superpowers/specs/2026-06-24-understand-figma-foundation-design.

gitblog_00062的博客 326

用CentOS 7安装cadence搭建适合IC Design的科研环境（四）——IC617、MMSIM151、calibre2015安装过程step by step

以下操作都在root权限下执行。建立安装目录建议把这种大型软件装在/opt目录下。mkdir -p /opt/cadence/installscape mkdir -p /opt/mentor/Calibre2015其中-p参数是直接建立父目录。因为IC617和MMISM151会自己建立安装目录，所以在这里没有建相关目录。而calibre则是默认安装在安装包所在的目录下，所以需要提前建立。解压安

maxwell2ic的博客 7万+

microblaze之Video Processing Subsystem调试误区

内容：总结video processing subsystem调试中遇到的问题，以及在解决问题中的思路方法论，引为前车之鉴。 1，我的目的是希望采用vps中的scaler模块对图像进行拉伸缩小。IP的配置如下： 2，整个系统的框架图如下，仅比上期的内容增加了scaler模块，如下： 3，查手册，可以知道这个scaler only组件分成了hscale,vscale和GPIO，其中GPIO是控制上下游stream流控设备复位用，暂时忽略。 hscale和vscale的寄存器空间如下，主要关注图

YDY5659150的专栏 3556

Python,C++开发21世纪商业模式10000例与实操大全APP

{"id": 1, "title": "订阅模式", "industry": "互联网", "description": "通过订阅收费，如Netflix。{"id": 2, "title": "共享经济", "industry": "交通", "description": "通过共享资源盈利，如Uber。{"id": 1, "title": "订阅模式", "industry": "互联网", "description": "通过订阅收费，如Netflix。

2501_90802096的博客 651

卡尔曼滤波、互补滤波与Tsinghua滤波：平衡车姿态感知的三大算法对比

本文对比了平衡车姿态感知中的卡尔曼滤波、互补滤波与Tsinghua滤波三大核心算法。互补滤波计算简单，适合入门；卡尔曼滤波理论最优但实现复杂；Tsinghua滤波则是一种面向嵌入式优化的轻量级方案，通过动态权重调整和零偏估计，在资源受限的MCU上实现了性能与效率的平衡，是智能车竞赛等场景的实用选择。

weixin_29232121的博客 349

Jan 安装、配置与使用指南：在电脑上搭建离线 AI 助手

Jan 是一个开源的 ChatGPT 替代品，能把大语言模型（LLM）完整运行在你自己的电脑上，支持离线对话。它适合学生、个人用户和轻度开发者。本文带你完成 Jan 的安装、首次启动和常用配置，不预设任何编程基础。 ## 什么是 Jan，适合谁用 Jan 本质上是一个桌面聊天应用：内置模型下载入口，可以从模型仓库拉取 Llama、Gemma、Qwen 等开源模型，在本地推理，不经过云端。除了纯

gitblog_00298的博客 239

在 Visual Studio Code 中开发 SAP Fiori 应用并部署到 Cloud Foundry 的完整实战指南

摘要：本文介绍如何以ABAP RAP服务为后端，通过VS Code和SAP Fiori工具将Fiori应用一键部署到SAP BTP Cloud Foundry环境。主要内容包括：1) 开发环境配置（VS Code+Fiori工具）；2) 架构流程说明（MTA打包、Approuter路由）；3) 权限准备（业务Catalog分配）；4) 创建带Approuter的MTA项目；5) 连接ABAP OData服务并生成Fiori应用。文中还针对常见问题（如服务不可见、部署失败）提供了解决方案参考。

2007 年 ~ 2025 年，深耕 SAP 技术 18 年 370

Openclaw第5章 知识库管理

💡：学会使用 OpenClaw构建个人知识库系统，实现网页文章存档、GitHub项目管理、论文笔记整理和跨设备同步。

Maynor的博客 777

Understand-Anything /understand-figma 设计规格解析：把 Figma 文件变成可交互的设计知识图谱

本文以 Understand-Anything 仓库中已批准的 `/understand-figma` 基础版设计规格（[2026-06-24-understand-figma-foundation-design.md](https://link.gitcode.com/i/8ce543214700c0ce739274604944a654)）为主体，完整拆解该规格提出的技术方案：Figma 文件如

gitblog_00364的博客 474

汽车LIN总线（3） -- 协议层：帧的类型

主要介绍LIN协议层中帧的类型，介绍中加入一点自己的理解（带下划线的是，其余是官方资料）。

晴朗luo的博客 889

Shadow & Sound Hunter实现智能UI设计：Figma插件开发

本文介绍了如何在星图GPU平台上自动化部署🗡️ 寻音捉影 · 侠客行 (Shadow & Sound Hunter)镜像，赋能Figma智能UI设计优化。该镜像可实时分析阴影层级、色彩对比度与可访问性，并为登录页、卡片组件等典型界面提供量化反馈与一键适配方案，显著提升设计规范性与跨职能协作效率。

weixin_42515392的博客 117

假人有限元模型

假人模型，车辆碰撞假人有限元模型，适合做乘员安全的研究者利用

Outlook Express 6 (OE6) for Win7/Win8/Win10

英文版 Outlook Express6.0， 兼容Win7/Win10/WinXP，解压就可用。

从Figma到上线只需22分钟：AI网页设计闭环工作流（含4类行业专属组件库）

22分钟完成从Figma设计到网页上线，这是一套高效落地的AI网页设计教程。覆盖电商、教育、企业官网、创意工作室四类行业专属组件库，融合AI生成、智能标注与一键部署闭环工作流。解决设计师开发协作低效痛点，提升交付速度与一致性，值得收藏。

LogicPlex的博客 190

OV9734 DATASHEET，完整规格书

OV9734完整规格书，包括电气参数，尺寸规格，寄存器配置表等

Android studio安卓期末大作业日记本app项目

集成第三方库如richeditor-android支持加粗/斜体/下划线。SQLite数据库存储日记数据，包含标题、内容、日期、图片路径等字段。使用WorkManager实现定时云端备份（可选Firebase）支持API Level 21（Android 5.0）及以上。RecyclerView展示日记列表，支持滑动删除和点击编辑。Android Studio 4.0及以上版本。NLP情绪分析（可选科大讯飞API）调用和风天气API自动添加天气数据。需要处理网络权限和JSON解析。实现指纹/图案解锁界面。

weixin_67803108的博客 965

android 蓝牙通讯demo

android 下蓝牙通讯demo，实现了发现蓝牙，使能蓝牙，通过蓝牙发送消息。
上一篇： 20-Figma-2.5D图标绘制技法
下一篇： 22-Figma-常见项目框架搭建
点赞 1
评论 0
书签 书签 0
billycoder
billycoder
博客等级 码龄17年 171粉丝 188原创
+ 关注 专栏目录 订阅专栏
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值