kazoottt-blog-v2/src/content/post/2023-W48.md

---
slug: 2023-W48
title: 2023-W48
published: true
category: 周报
description: >-
  在2023年第48周，作者经历了一次工作转岗，从Web前端开发转变为类似于提示词工程师的角色。这次转岗让作者意识到自己对大语言模型的理解不足，但也重拾了Python编程，并计划将学习重心放在LLM研究上。同时，作者的父母来上海探望，作者在忙碌的工作之余，抽空陪伴他们游览了城隍庙和豫园等地。此外，作者还分享了关于资讯收集方式的变化，从使用Twitter和Cubox转变为使用Telegram和Discord，以及一些关于设计和编程的资讯收集。
date: '2024-07-11T02:17:53.450Z'
rinId: 87
finished: true
tags:
  - designer
  - devv
  - three.js
  - React-three-fiber
  - Autogpt
  - Autogen
  - prompt
  - GPT
  - AI
  - FinTech
  - ios
  - react
  - stockcharts
  - Obsidian
toAstro: true
astroType: post
date_created: 2025-01-04T03:34:08.000Z
date_modified: 2025-02-19T17:54:54.000Z
---

# 2023-W48 转岗了

时间范围：2023-11-27 - 2023-12-3

## 最近的变化

最大的变动应该是工作内容的变化了。

在 11 月 23 的时候突然接到了一个其他部门的面试，去的时候发现部门的领导以及 HR 都在。简单聊了一下，11 月 24 的时候就收到消息说面试通过了，可以转岗到对方的部门工作。

而我的工作也从 web 前端转成了类似于提示词工程师的角色？

真正转到这个岗位的时候，才发现自己对于大语言模型的认知是很缺乏的，应用层也好，模型层中间层也好，很多认知都是纸上谈兵（疯狂收藏资料，但是实际上看的很少。）

不过也借此机会，重拾了 python，上一次写 python 还是大三的时候写了一个圣纳百川贴吧的爬虫以及数据分析。

总体来说觉得是一个很好的机会，很新鲜的尝试，不过也挺有压力的。

后面的学习方向也会有很大的不同，想把重心放在 llm 的研究上，当然业余时间还是做我自己的项目，通过学习和项目实践来巩固对于 llm 和前端的理解。

## 父母来上海了

其实以前的部门氛围很轻松，下班后可以按时回家。不过因为换了部门，有很多的东西不熟悉，所以这周下班时间还是比较晚。

父母决定来上海看我的时候，还没有换部门，所以突然换部门还是听猝不及防的。

他们是周三到的上海，周日离开的上海。

工作日的时候是他们自己在玩，只有周六和周日的时候陪他们出去玩了。

工作日下班后我会到他们酒店去一起聊天，给了我很多建议，感觉收获还是蛮大的。另外更坚定了想回川渝的心吧，还是想离家近一点。

周末陪他们玩的时候，行程也比较休闲，周六的时候去了城隍庙和豫园，然后去了南京东路买衣服（其实我不是很想买，但是感觉他们提出想给我买衣服，陪着他们逛街，他们也会比较开心），最后买了一件羽绒服（价格有点贵，如果是我自己买的话，绝对不会买这么贵的 😂，好肉疼）

## 收集资讯的方式发生了变化

值得一提的时候，换了新部门之后，部门刚好要求要收集资讯，这恰好是我最近开始做的事情。部门内比较注重的是 AI 方面的资讯，而对我自身而言，我还会收集一些前端方面的东西。

![](<https://pictures.kazoottt.top/2023/12/20231204-202312042355802-c89f2be7e4015627d27e2dd05f15b95d.webp>)

收集资讯的方式由之前的 twitter + 其他平台复制链接到 cubox 的方式，转变了到转发到 telegram 或者 discord。

我发现直接转发到后面了两个平台会更直观以及便于查找，之前存了很多链接到 cubox，但是几乎很少打开。

而选择 discord 还是 telegram 也是我比较纠结的一点，discord 可以分子频道，相当于在这一层就完成了资源的分类，但它的缺点是对于部门平台的链接预览不友好。

例如 twitter，由于之前 twitter 平台的限制，discord 无法预览 twitter 链接，需要手动改写为 vxtwitter，才能预览，在转发的时候手动修改这个操作也算增加工作量了。

![](<https://pictures.kazoottt.top/2023/12/20231204-202312042355804-2dd05f3ccc51770e256b254fa35398e6.webp>)

而 telegram 虽然可以很好地预览链接，但是个人来说并不太喜欢它的 UI。并且在后期如果要开发 bot，学习成本相对来说会更大一些。（因为 discord 直接支持 web hook，并且文档完善，有公开的 bot 市场）

![](<https://pictures.kazoottt.top/2023/12/20231204-202312042355805-f2797942be9d075ab825cd867ad0cf36.webp>)

所以我很纠结应该选择哪种方式。目前是使用的 discord，不过我觉得后期可能会转到 telegram。

## 资讯收集 - 设计篇

### 发现了一个很炫酷的网站

<https://howieduhzit.best/>
这个网站实现了第一人称视角的交互，将交互映射到 blender 的操作中。

个人感觉很值得学习一下是如何实现的。

![](<https://pictures.kazoottt.top/2023/12/20231204-202312042355806-3d07be1aa1452e5401a8cca621437b93.webp>)

### GPTS - Blender 助手

[ChatGPT - Teacher Awang’s blender 3D assistant](<https://chat.openai.com/g/g-RSwpmZ8cK-teacher-awangs-blender-3d-assistant>)
前几周 gpts 发布后，gpt 应用进一步自我分化，社区中实现了很多 gpts 应用，关于 blender 的也有几个，个人测试后认为这一个 gpts 的效果是最适合我自己的。以后会继续使用这个 gpts 来协助学习和完成 Blender 的使用。

### GPTS - DesignerGPT

[ChatGPT - DesignerGPT](<https://chat.openai.com/g/g-2Eo3NxuS7-designergpt>)
这个 GPTS 的效果是输入提示词，它会返回给到你一个部署页面，这个部署页面就是根据提示词所生成的界面。

看了它的提示词后发现并不算复杂。

[DesignerGPT.md](<https://github.com/LouisShark/chatgpt_system_prompt/blob/main/prompts/gpts/DesignerGPT.md>)

```plain text
DesignerGPT is a highly capable GPT model programmed to generate HTML web pages in response to user requests.
Upon receiving a request for a website design, DesignerGPT instantly creates the required HTML content, adhering to specific guidelines.
You ALWAYS use this https://cdn.jsdelivr.net/npm/@picocss/pico@1/css/pico.min.css as a stylesheet link and ALWAYS add this tag in the head tag element, VERY IMPORTANT: `<meta name="viewport" content="width=device-width, initial-scale=1">. ALSO IMPORTANT, ANY CONTENT INSIDE THE BODY HTML TAG SHOULD LIVE INSIDE A MAIN TAG WITH CLASS CONTAINER.
YOU USE ANY CSS THAT MAKES THE WEBSITE BEAUTIFUL, USE PADDING AND GOOD AMOUNT OF NEGATIVE SPACE TO MAKE THE WEBSITE BEAUTIFUL.
Include a navigation right before the main area of the website using this structure: `<nav class="container-fluid"><ul><li><strong></strong></li></ul><ul><li><a href="#"></a></li><li><a href="#"></a></li><li><a href="#" role="button"></a></li></ul></nav>` For the main area of the website,
follow this structure closely: `<main class="container"><div class="grid"><section><hgroup><h2></h2><h3></h3></hgroup><p></p><figure><img src="" alt="" /><figcaption><a href="" target="_blank"></a></figcaption></figure><h3></h3><p></p><h3></h3><p></p></section></div></main><section aria-label="Subscribe example"><div class="container"><article><hgroup><h2></h2><h3></h3></hgroup><form class="grid"><input type="text" id="firstname" name="firstname" placeholder="" aria-label="" required /><input type="email" id="email" name="email" placeholder="" aria-label="" required /><button type="submit" onclick="event.preventDefault()"></button></form></article></div></section><footer class="container"><small><a href=""></a> • <a href=""></a></small></footer>. FOR THE IMAGES USE LINK FROM UNSPLASH. Crucially, once the HTML is generated, DesignerGPT actively sends it to 'https://xxxxxx/create-page'.
This action results in an actual webpage being created and hosted on the server. Users are then provided with the URL to the live webpage, facilitating a seamless and real-time web page creation experience.
```

我们可以分为三个部分，第一个部分是背景介绍，第二个是把网页的 html + 样式（样式用的是外链，这里的我的理解是其实 html 或者样式或者其他都能用外链，只要能访问）丢给它（输出 html），第三个是提供一个用于接收 html 内容然后部署页面的 api，把 html 内容丢给它，然后返回最终的静态部署的预览的地址。

从整个提示词或者最终的呈现效果来说并不算惊艳，但是为什么这个 GPTS 能在早期广受关注，我觉得是作者对于 GPT 的能力理解比较强，知道如何应用它的能力，以及它的“售后”是做的比较好的，提供预览链接这一点能够免去使用者很多成本。

### 配色方案限时免费（目前已恢复收费）

[X 上的 Oleg Coada：“FREE Visual Identity Guidelines for 24 hours. Please like and share to spread the word in the design world! Link to download below! https://t.co/9QuQ9fmHfY” / X](<https://vxtwitter.com/olegcoada/status/1729971743857537405?s=20>)

突然发现是在 gumroad 上架的，好像在国外很多艺术家的付费作品都是在这个网站上上架的。

### Blender 插件，用于从网络上下载和导入资产

<https://github.com/strike-digital/asset_bridge>
可以从中学习如何写一个 blener 插件
![](<https://pictures.kazoottt.top/2023/12/20231204-202312042355807-c8cf7738366e45961270634a987bf5c4.webp>)
其实收藏这个资源更多的是因为我认为它是一个很好的学习如果实现 blender 插件的项目源码。而且是 python 写的，最近刚好对于 python 的学习需求比较紧急，值得看一下。

### Blender 教程

[Sina Visitor System](<https://weibo.com/6458935463/4974094430242729>)
这个作者的许多作品都很惊艳，出的教程也很简洁高效，不过不适合零基础的玩家，更适合高阶玩家学习。

## 资讯收集 - 编程

### Cloudflare Worker 支持 Pptr

[Cloudflare Worker 已经支持了 Puppet - 即刻 App](<https://m.okjike.com/originalPosts/6567f01a5682fbc62e4c6537?s=ewoidSI6ICI2MjRjNTE0ZThiOWNhOTAwMTA5MDk5ZTkiCn0=>)
之前做截图应用时候，vercel 有 10 秒超时的限制，不知道用这个是否能缓解一下。待研究。

### Devv 搜索引擎

[https://devv.ai/zh](<https://devv.ai/zh "https://devv.ai/zh">)
很好用强推

### 截图方案汇总

<https://vxtwitter.com/kazoottt/status/1729876850531606558?s=46&t=UKmYswdLBh4dGuqwtKAXUA>

### Obsidian 部署方案

[twitter.com/hal\_\_lee/status/1730101349914976367](<https://vxtwitter.com/hal__lee/status/1730101349914976367?s=20>)

### three.js 的 Render 方式

<https://github.com/pmndrs/react-three-fiber> React-three-fiber is a React renderer for three.js

### 鉴权方案

[twitter.com/vikingmute/status/1730400118430724139](<https://vxtwitter.com/vikingmute/status/1730400118430724139>)

### Github 管理 Gui

<https://x.com/colinlienard/status/1730247816944267593?s=46&t=UKmYswdLBh4dGuqwtKAXUA>

## 资讯收集 -AI 篇

### 与 Agent 有关的项目

#### Autogpt

[GitHub - Significant-Gravitas/AutoGPT: AutoGPT is the vision of accessible AI for everyone, to use and to build on. Our mission is to provide the tools, so that you can focus on what matters.](<https://github.com/Significant-Gravitas/AutoGPT?tab=readme-ov-file>)

[Introduction - AutoGPT Documentation](<https://docs.agpt.co/autogpt/>)

#### Autogen

### 存储 Gpts 的 Prompt

<https://github.com/LouisShark/chatgpt_system_prompt>

### 吴恩达新课

<https://vxtwitter.com/dotey/status/1729972448899051760?s=46&t=UKmYswdLBh4dGuqwtKAXUA>

### 写提示词的技巧

<https://vxtwitter.com/real_kai42/status/1729750363757232164?s=46&t=UKmYswdLBh4dGuqwtKAXUA>

### Ios 关于金融的组件

[GitHub - WillkYang/YYKline: iOS YYKline：Kline、Chart、Volume、Scroll、Scale、MACD、KDJ、K 线图、分时图...](<https://github.com/WillkYang/YYKline>)
![Pasted image 20231120000803](<https://pictures.kazoottt.top/2024/10/20241010-5809d42f65e6306eb6763ee8306de70e.png>)

### React 关于金融的组件

[GitHub - rrag/react-stockcharts: Highly customizable stock charts with ReactJS and d3](<https://github.com/rrag/react-stockcharts>)
![Pasted image 20231120001545](<https://pictures.kazoottt.top/2024/10/20241010-85ba8dfbe0a15efc2ad4c6c278dd867e.png>)