WithAI.Design

5 min read

有必要做一个我的Figma插件的教程

有必要做一个我的Figma插件的教程

前言

事情是这样的,我不是做了个Figma插件吗?前面我有写文章介绍过,但是一直也没人用~扎心了。# 【AI辅助设计】Figma-ComfyUI插件正式上线了!免费使用!附教程。 其实根据UI设计师的工作流,提供一个AI工具辅助,但是门槛稍微有点高,毕竟全本地运行,对设备要求稍高,还不支持Mac(或者需要一定的努力💪)。

然后,最近看到一款老外做的插件,功能跟我的差不多,但是区别在于他连的是在线服务器,而且,体验好很多(这个惭愧,作为曾经体验设计师的我,丢脸了。。🥱),但是呢,这个插件也不免费,需要12刀每月,才能无限使用,这就离谱了!所以,还是有必要介绍一下我这个免费插件的使用方法,希望对设计师们有用!

关于这个插件和对比,我放在视频了,大家可以看看。

视频号

我可能会分几期去出教程,今天先看看使用线稿生成高质量3D图标。

cover.jpg

具体使用到的插件功能是:Skecth to image

用途和效果

可以通过简单的勾画,如图标、形象等,还有提示语方式,就可以生成效果惊艳的效果图。

  1. 图标的设计
  2. 平面元素创作
  3. 3D可视化
  4. 其他视觉设计或UI设计

使用方法

  1. 安装并打开插件-ComfyUl Image Generator

  1. 选择Sketch to lImage模式

image 1.png

  1. 输入提示词和控制强度。

提示词我已经帮忙整理了,是参考另外一个插件的,可以翻到文末看看~

image 2.png

提示词对照表

参考 Unblocked AI 插件生成的。如有不妥,请作者联系我,我会修改。

image 3.png

3D-rendered object with a slightly grainy, textured surface. The object is [light blue] with a speckled effect, giving it a soft, matte appearance. It is centered against a plain white background, creating a minimalist look with clear shadows that emphasize its three-dimensional structure. The style is modern and clean, highlighting the simplicity of the shape and texture.

image 4.png

Photorealistic, detailed 3D-rendered opal with a soft, semi-translucent finish that has a subtle inner glow, in pastel shades, giving it an ethereal, gemstone-like quality, standing against a plain background.

image 5.png

Photorealistic 3D-rendered object with a smooth, glossy, ceramic surface in a [mint green] color. Centered against a plain white background, the minimalist design highlights its reflective texture and dimensionality with subtle shadows.

image 6.png

Photorealistic 3D-rendered object with a rough, rusted iron surface. The object displays shades of deep brown and orange, showcasing the textured corrosion. Centered against a plain [white background], the minimalist composition accentuates its industrial aesthetic with pronounced shadows highlighting its rugged form.

这个提示语,需要配合渐变原图且strength:1

image 7.png

image 8.png 3D-rendered object crafted from transparent acrylic with sharp, faceted edges. The clear material refracts light, creating prismatic effects and subtle rainbows against a plain [white background]. The design is sleek and modern, emphasizing clarity and precision.

image 9.png 3D-rendered marble object. Made of smooth, polished marble with intricate [gray] veining throughout. The object is predominantly white, exuding elegance and timelessness. Set against a plain [white background], the design focuses on the natural beauty and its cool, refined texture.

image 10.png Photorealistic, detailed 3D-rendered object with a cracked, desert clay texture in earthy tones of terracotta and beige. The texture is dry and rugged, giving it an ancient, weathered appearance. Standing object, centered against a plain [white background], the minimalist style emphasizes its organic form and arid character.

image 11.png 3D-rendered object enveloped in shimmering gold leaf with a slightly irregular, hand-applied texture. The lustrous surface catches light from various angles, creating a radiant glow against a plain [white background]. The style is opulent and artistic, highlighting craftsmanship and luxury.

需要配合金色渐变底图

image 12.png

image 13.png

Photorealistic 3D-rendered object with a bubbly, translucent gel surface in vibrant [red]. The semi-transparent material allows light to pass through, creating depth and interest. Centered against a plain [white background], the design is playful and modern, emphasizing texture and color.

image 14.png

3D-rendered object in the shape of the mask image, with a woven rattan surface, showcasing the intricate pattern of natural fibers. The warm, honey-toned material adds an earthy feel. Set against a plain [white background], the minimalist composition highlights the handcrafted quality and texture.

image 15.png

Photorealistic 3D-rendered object featuring a metallic rose gold surface with a brushed finish. The soft pinkish hue and subtle sheen give it a contemporary and elegant look. Centered against a plain white background, the design emphasizes its sleek form and reflective properties.

需配合浅金渐变底图

image 16.png

image 17.png

3D-rendered object with a cracked ice texture, appearing as if carved from a block of clear ice with sharp, angular facets. The translucent surface refracts light, creating cool blue highlights against a plain [white background]. The style is crisp and refreshing, emphasizing purity and sharpness.

image 18.png

Photorealistic 3D-rendered object with a sparkling, crystalline sugar surface in pure white. The granular texture catches light, creating tiny glints and a delicate shimmer. Centered against a plain white background, the style is simple yet whimsical, highlighting texture and light play.

image 19.png

A 3D-rendered object made from translucent, colored resin with swirling patterns of teal and aqua. The material has depth and fluidity, resembling ocean waves. Set against a plain white background, the style is artistic and serene, emphasizing movement within the material.

image 20.png

Photorealistic 3D-rendered object made of clear, sparkling water encapsulated in a perfect geometric shape. The liquid surface has subtle ripples and reflections, giving it a dynamic yet tranquil appearance. Centered against a plain [white background], the design emphasizes purity and fluidity.

image 21.png

Photorealistic 3D object featuring a surface of overlapping autumn leaves in vibrant shades of red, orange, and yellow. The textured layers add depth and warmth. Set against a plain [white background], the minimalist setup highlights the natural beauty and colors of the season.

image 22.png

Photorealistic 3D-rendered object with a surface of smooth, white porcelain adorned with delicate blue floral patterns, reminiscent of traditional Chinese ceramics. Centered against a plain [white background], the design emphasizes elegance and cultural artistry.

image 23.png

A 3D-rendered object made of translucent soap bubbles clustered together, reflecting iridescent colors. The delicate surface shimmers with hues of pink, blue, and green. Set against a plain white background, the style is whimsical and light, highlighting fragility and beauty.

image 24.png

Photorealistic 3D-rendered object with a surface of overlapping fish scales in iridescent blues and greens. The textured layers reflect light, creating a shimmering effect. Centered against a plain white background, the design highlights nature and intricate patterns.

image 25.png

Photorealistic 3D-rendered object with a smooth, satin fabric surface in deep burgundy. The material subtly reflects light, giving it a rich, luxurious appearance. Centered against a plain white background, the design focuses on texture and elegance.

image 26.png

A hand-drawn illustration of a whimsical treehouse nestled among the branches, rendered in a detailed ink and watercolor style. The colors are vibrant yet soft, giving it a storybook feel against a textured paper background.

image 27.png

A minimalist line drawing of a mountain range, using bold black ink strokes against a white background. The simplicity emphasizes the geometric shapes and contours of the peaks.

image 28.png

Photorealistic 3D-rendered object with a rich, elegant wooden surface, featuring a refined and natural wood grain in a palette of warm, neutral tones. The subtle texture of the wood captures and reflects light, creating a soft, natural glow and a delicate interplay of shadows. Centered against a clean, plain white background, the style is simple yet sophisticated, emphasizing the beauty of the natural wood grain and the gentle dynamics of light.

放大处理

如果对效果不满意,可以使用放大功能进行细节放大,会得到你想要的效果。

使用方法

  1. 选择upscale模式

image 29.png

  1. 选择要放大的图

image 30.png

  1. 点击Generate
  2. 等待结果 Rectangle.png

细节满满的~

image 31.png

大家设备允许的话,还是用起来吧,其实还有好多应用场景呢。后面我也会增加工作流,如扩图、生成填充、指定移除图片物体等。

🌟 想了解更多 AI 辅助设计工具与灵感趋势?欢迎关注公众号【设计小站】:sjxz00。

标签