杜架的记录与分享(014期)

发表于 更新于 分类于 本文字数： 2.9k 阅读时长 ≈ 10 分钟

杜架的记录与分享，记录与思考有价值的信息，主要包含：碎片化思考，阅读笔记分享，软件分享，内容记录等。内容主题有极大的个人喜好偏向，爱我所爱，想我所想，写我所写。

新疆烤包子

思考

在即刻看到这么一段文字，挺有收获的，关注的问题是在企业如何落地 AI。我将内容分享一下：

今天参加了一个「制造业+AI 」的行业交流活动，很有意思。

有意思的地方不是行业专家给的具体洞见，而是提问环节。
​
​ 一位工厂的老板提问：“刚刚嘉宾分享了很多 AI 帮助企业提效的案例，说的有点快，我还是不懂，如果想在自己的企业里落地 AI，到底该怎么做？”
​
​ 有位分享嘉宾是罗兰贝格的前合伙人，他就回答，你要去梳理业务场景，把相关方拉到一起，怎么找需求点，怎么算价值点，怎么确定落地方案巴拉巴拉……
​
​ 企业主又问了一遍：“这些事我都知道，但我毕竟是个小白，听完还是不清楚我该怎么去抓这件事。”
​
​ 罗兰贝格的前合伙人把刚才的答案换着方法又说了一遍，还让企业主去参照当年数字化转型的做法。

企业主更加困惑了，说：“你说的这些实在太宽泛了…能不能站在我的角度来给我解答？”
​
​ 眼看场面陷入僵局，有一个科沃斯的代表站起来介绍，他们是怎么落地的实践经验。
​
​ 首先，他讲到了这件事要办成，既要自上而下，又要自下而上。
​
​ 企业主之所以困惑，在于他的思路局限在了“自上而下”的定势里。当对方提到“自下而上”这四个字的时候，他眼睛一亮，这里有信息增量！

​
​ 科沃斯的做法是：

1） 董事长确立落地 AI 的战略
​2）人力资源部牵头，IT 部门配合，通过企业内部培训这个场域作为落地平台
3）自下而上：鼓励员工自己去探索如何用 AI 来提效，在内部平台上分享、沉淀，举办夜校交流活动
​4）最关键的来了：员工之所以有动力去做，因为 AI 可以让他们减少加班时长、合法摸鱼
​5）就这样，科沃斯收获了一大批由员工自己开发的内部应用，涉及：财务人事 IT 设计研发…
​
​ 企业主频频点头。这个答案未必是完美的，但里面有他要的东西——我用什么来抓这件事？
​
​ 翻译成大白话就是：员工凭什么听我的？

前面那位咨询顾问没听懂这句潜台词。他给出的答案你可能挑不出毛病，但也挑不出什么价值点。

改革不是老板拿着一套 SOP 搬到自己的公司就完了。背后有太多太多问题了，比如：
​
1）你让员工直接照着最佳实践改，可他说更习惯之前的做法怎么办？

2）你又叫来了一批人一起梳理，底下人有情绪，你镇不住场怎么办？

3）你说要换新系统，那么旧系统的既得利益者如何安抚？

4）最后你强行推了没有成果，另一个派系借机发难要你下台怎么办？

……

企业里如何落地 AI，详见 https://m.okjike.com/originalPosts/676d251ee37b1cc0c0f60892

看了科沃斯的案例，再结合我们公司的 AI 落地情况，有点似曾相识，既有自上而下，又有自下而上，这种处理问题的方式和方法也应该是可以用在解决其他问题上的，学习了。

原文中还说了一个说法，我没有摘录，这里说一下。咨询整体来说是一个价值很模糊的行业。要么，你有实操经验，比案主更了解业务本身，才能讲到关键细节，带来信息增量。要么，你非常聪明，能快速凭借逻辑推理，用第一性原理抓住问题本质，让案主跳出思维陷阱。

为什么我们做技术的也比较关注技术案例，和其他行业一样的，只有真实的案例才更贴切业务本身，才能看是否解决关键问题，最终让自己的技术选型或者方案少走弯路。

当你没有相应的实操经验，可以考虑跳出思维陷阱，用第一性原理抓住问题的本质。又学到一个处理问题的思维方式。

笔记

如何更好的述职

换位思考、框架构建、突出成果和讲故事等策略

  • 首先，了解评委的关注点，确保汇报内容与目标相关；
  • 其次，不要简单列举工作，而是提供清晰的框架；此外，选择 1-3 个重点成果进行深入讲解，以抓住评委的注意力；
  • 最后，通过讲述个人成长故事或未来想法，为汇报增添代入感，帮助评委更好理解你的价值和潜力。

推荐文章

开发相关项目

tesseract.js

https://github.com/naptha/tesseract.js

纯 js OCR 库，支持 100+语言

1
npm install tesseract.js
1
2
3
4
5
6
7
8
9
import { createWorker } from 'tesseract.js';

(async () => {
  const worker = await createWorker('eng');
  const ret = await worker.recognize('https://tesseract.projectnaptha.com/img/eng_bw.png');
  console.log(ret.data.text);
  await worker.terminate();
})();

https://github.com/m31coding/fuzzy-search

一个快速、准确且多语言的前端模糊搜索库。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
import * as fuzzySearch from './path/to/fuzzy-search.module.js';

const searcher = fuzzySearch.SearcherFactory.createDefaultSearcher();

const persons = [
  { id: 23501, firstName: 'Alice', lastName: 'King' },
  { id: 99234, firstName: 'Bob', lastName: 'Bishop' },
  { id: 5823, firstName: 'Carol', lastName: 'Queen' },
  { id: 11923, firstName: 'Charlie', lastName: 'Rook' }
];

const indexingMeta = searcher.indexEntities(
  persons,
  (e) => e.id,
  (e) => [e.firstName, e.lastName, `${e.firstName} ${e.lastName}`]
);
console.dir(indexingMeta);
/* {
  "entries": {
    "numberOfInvalidTerms": 0,
    "numberOfDistinctTerms": 12,
    "normalizationDuration": 0,
    "numberOfSurrogateCharacters": 0,
    "indexingDuration": 1
  }
} */

const result = searcher.getMatches(new fuzzySearch.Query('alice kign'));
console.dir(result);
/* {
  "matches": [
    {
      "entity": {
        "id": 23501,
        "firstName": "Alice",
        "lastName": "King"
      },
      "quality": 0.8636363636363635,
      "matchedString": "Alice King"
    }
  ],
  "query": {
    "string": "alice kign",
    "topN": 10,
    "minQuality": 0.3
  },
  "meta": {
    "entries": {
      "queryDuration": 0
    }
  }
} */

const removalResult = searcher.removeEntities([99234, 5823]);
console.dir(removalResult);
/* {
  "removedEntities": [
    99234,
    5823
  ],
  "meta": {
    "entries": {
      "removalDuration": 0
    }
  }
} */

const persons2 = [
  { id: 723, firstName: 'David', lastName: 'Knight' }, // new
  { id: 2634, firstName: 'Eve', lastName: 'Pawn' }, // new
  { id: 23501, firstName: 'Allie', lastName: 'King' }, // updated
  { id: 11923, firstName: 'Charles', lastName: 'Rook' } // updated
];

const upsertMeta = searcher.upsertEntities(
  persons2,
  (e) => e.id,
  (e) => [e.firstName, e.lastName, `${e.firstName} ${e.lastName}`]
);
console.dir(upsertMeta);
/* {
  "entries": {
    "numberOfInvalidTerms": 0,
    "numberOfDistinctTerms": 12,
    "normalizationDuration": 0,
    "numberOfSurrogateCharacters": 0,
    "upsertDuration": 0
  }
} */

const result2 = searcher.getMatches(new fuzzySearch.Query('allie'));
console.dir(result2);
/* {
  "matches": [
    {
      "entity": {
        "id": 23501,
        "firstName": "Allie",
        "lastName": "King"
      },
      "quality": 1,
      "matchedString": "Allie"
    }
  ],
  "query": {
    "string": "allie",
    "topN": 10,
    "minQuality": 0.3
  },
  "meta": {
    "entries": {
      "queryDuration": 0
    }
  }
} */

渐变色生成

https://gradients.app/zh/mesh

渐变色在线生成网站

Img

tailwind 渐变生成器

https://gradienty.codes/

超过 20,000 个精心制作的渐变系列，可以一键复制。

Img

tailwind 组件

https://preline.co/examples.html

免费的 tailwind 组件和模板，使用 tailwind 时候，可以复制代码直接使用。模板貌似需要下载，有 5 个免费模板。

Img

有用又好玩的软件

alt-tab-macos

https://github.com/lwouis/alt-tab-macos

在 macOS 系统上实现 Windows 的 alt-tab 功能,开源免费，比官方 command+tab 要好用很多。

Img

pixpin

https://pixpinapp.com/

屏幕截图，录制屏幕，长截图，文字识别，贴图等功能，基本免费使用。

Img

wechatDataBackup

https://github.com/git-jiadong/wechatDataBackup

一键导出 PC 微信聊天记录工具

Img
Img

Real Address Generator

https://realaddress.fuyiran.com/?country=US

真实地址生成器

Img

WebChat

https://github.com/molvqingtai/WebChat

WebChat 可以实现在任何网站和安装此软件的人匿名聊天。

Img

开源许可证选择器

https://open-source-license-chooser.toolsnav.top/zh/

Img

public-portfolio-site

https://github.com/ricocc/public-portfolio-site

设计师的个人网站，可以用来公开的作品网站模板

Img

免费真人头像

https://www.piclooks.com/avatars

AI 生成的可以免费使用的真人头像

Img

AI 项目

最近两年有很多有意思的 AI 项目，存在很大的参考价值，新增一个目录，记录一下，未来可以参考相关设计。

uicloner-extension

https://github.com/AndySpider/uicloner-extension

一个可以通过截图生成 tailwind 样式网页的浏览器插件

Img

该项目 Prompt 值得参考与学习。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
const USER_PROMPT = `
Generate code for a web page that looks exactly like this.
`;

const HTML_TAILWIND_SYSTEM_PROMPT = `
You are an expert Tailwind developer
You take screenshots of a reference web page from the user, and then build single page apps
using Tailwind, HTML and JS.
You might also be given a screenshot(The second image) of a web page that you have already built, and asked to
update it to look more like the reference image(The first image).

- Make sure the app looks exactly like the screenshot.
- Pay close attention to background color, text color, font size, font family,
padding, margin, border, etc. Match the colors and sizes exactly.
- Use the exact text from the screenshot.
- Do not add comments in the code such as "<!-- Add other navigation links as needed -->" and "<!-- ... other news items ... -->" in place of writing the full code. WRITE THE FULL CODE.
- Repeat elements as needed to match the screenshot. For example, if there are 15 items, the code should have 15 items. DO NOT LEAVE comments like "<!-- Repeat for each news item -->" or bad things will happen.
- For images, use placeholder images from https://placehold.co and include a detailed description of the image in the alt text so that an image generation AI can generate the image later.
- You can use Font Awesome for icons.
- You can use Google Fonts

Return only the code in <div></div> tags.
Do NOT include markdown "\`\`\`" or "\`\`\`html" at the start or end.
`;

const HTML_CSS_SYSTEM_PROMPT = `
You are an expert CSS developer
You take screenshots of a reference web page from the user, and then build single page apps
using CSS, HTML and JS.
    You might also be given a screenshot(The second image) of a web page that you have already built, and asked to
update it to look more like the reference image(The first image).

- Make sure the app looks exactly like the screenshot.
- Pay close attention to background color, text color, font size, font family,
    padding, margin, border, etc.Match the colors and sizes exactly.
- Use the exact text from the screenshot.
- Do not add comments in the code such as "<!-- Add other navigation links as needed -->" and "<!-- ... other news items ... -->" in place of writing the full code.WRITE THE FULL CODE.
- Repeat elements as needed to match the screenshot.For example, if there are 15 items, the code should have 15 items.DO NOT LEAVE comments like "<!-- Repeat for each news item -->" or bad things will happen.
- For images, use placeholder images from https://placehold.co and include a detailed description of the image in the alt text so that an image generation AI can generate the image later.
- You can use Font Awesome for icons.
- You can use Google Fonts

Return only the full code in <html></html> tags.
Do NOT include markdown "\`\`\`" or "\`\`\`html" at the start or end.
`;

uicloner-extension/blob/main/lib/llm.ts

Roo-Cline

https://github.com/RooVetGit/Roo-Cline

自主编码代理，能够在你的每一步许可下创建 / 编辑文件、执行命令、使用浏览器等等。

Img

https://github.com/voideditor/void

https://github.com/voideditor/void

voideditor 是 Cursor 的开源实现版本，目前状态为 waitlist

Img

cursor.directory

https://cursor.directory/

这个网站收集了各种开发语言最佳的 Cursor 配置 Prompt，涵盖 Python、Next.js、TypeScript、Swift、Node.js 等多种主流语言。

Img

说明

杜架的记录与分享相关信息：

🙌 如果你阅读到这里，相信我们一定是同道中人，有任何想法，欢迎私聊我，微信号：trumandu007。
⚡️ 如果你也是在西安地区从事 IT 相关工作，欢迎私信加入我建的 『西安 IT 技术圈』微信群,我们是一个什么样的群体？ 为什么要做『西安 IT 技术圈』。
👬🏻 朋友，都看到这了，确定不关注一下么 👇

trumandu_wechat_2022.png

参考资料

ß