Anthropic AI推出的Claude 3.5 Sonnet：特點、費用、操作說明及實作範例
閱讀時間約 19 分鐘
在人工智慧（AI）的迅速發展中，Anthropic AI推出的Claude 3.5 Sonnet模型引起了廣泛關注。這款模型以其強大的性能和靈活性，今天要跟大家介紹Claude 3.5 Sonnet的特點、費用、操作說明及實作範例，讓你輕鬆掌握這款強大的AI工具。
claude
https://claude.ai/
Claude 3.5 Sonnet介紹
Claude 3.5 Sonnet是Anthropic AI推出的一款先進的自然語言處理（NLP）模型，“Sonnet”象徵著該模型在語言處理上的優雅和精準，就如同一首完美的十四行詩。
該模型基於深度學習技術，主要處理和生成高質量的文本，無論是文章撰寫、語義分析還是對話系統開發，Claude 3.5 Sonnet都能提供卓越的性能。
與前一代模型相比，Claude 3.5 Sonnet在理解和生成程式碼方面有了顯著的進步，無論是生成小遊戲、切出網頁畫面，都能大幅提高開發效率。
Claude 3.5 Sonnet在各項測試中表現非常出色，尤其在知識理解、寫程式和小學數學方面優於其他模型，在解決數學問題方面，表現稍弱，但整體仍然領先。
圖片來源：Anthropic
費用
Claude 3.5 Sonnet 免費提供，每日訊息有次數限制。
訂閱Claude Pro/Team方案的用戶可以更快地使用模型，可以透過Anthropic API、Amazon Bedrock和Google Cloud的Vertex AI存取。
Claude 3.5 Sonnet支持200K的上下文長度，輸入token的價格為每百萬token 3美元，輸出token的價格為每百萬token 15美元，與Claude 3 Opus相比，Claude 3.5 Sonnet的費用更加實惠。
圖片來源：Anthropic
操作說明
操作Claude 3.5 Sonnet非常簡單，只需幾個步驟即可開始使用：
進入Claude首頁後，你可以使用google帳號或信箱登入
登入後，就可以開始使用Claude 3.5 Sonnet，在下方輸入框輸入你的描述
超過使用限制後，會出現你無法再使用免費的訊息，直到幾點「You are out of free messages until 5 PM」
實作範例
在程式設計能力上有更大突破，可以幫助使用者生成高質量的程式碼，能夠獨立編寫和執行程式碼，具有複雜的推理和進階的錯誤排除能力，讓使用者能快速開發小遊戲、網頁。
以下的範例會測試程式碼的撰寫能力
範例一：上傳圖像，切出網頁畫面
我上傳一張wireframe圖像，請Claude幫我用html+css切出網頁畫面
在最後，還會講解他撰寫的操作說明，讓不熟悉語法的開發者也能夠了解
下圖為生成結果，與提供的圖像切出來的差不多，只需要自行做樣式調整
以下是生成畫面的code
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Login Page</title>
<link rel="stylesheet" href="styles.css" />
</head>
<body>
<div class="container">
<div class="logo-container">
<div class="logo"><div class="mountain"></div></div>
</div>
<div class="dots">
<span class="dot"></span> <span class="dot"></span>
<span class="dot"></span>
</div>
<form class="login-form">
<input type="text" placeholder="Username" required />
<input type="password" placeholder="Password" required />
<div class="remember-me">
<input type="checkbox" id="remember" />
<label for="remember">Remember</label>
</div>
<button type="submit">Sign In <span class="arrow">→</span></button>
</form>
<div class="links">
<a href="#">Can't login in / One time</a>
<a href="#">Forgot Password?</a>
</div>
</div>
</body>
</html>
body {
font-family: Arial, sans-serif;
background-color: #f0f0f0;
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
margin: 0;
}
.container {
background-color: white;
padding: 40px;
border-radius: 20px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
width: 300px;
}
.logo-container {
text-align: center;
margin-bottom: 20px;
}
.logo {
width: 80px;
height: 80px;
background-color: #e0e0e0;
border-radius: 15px;
display: inline-flex;
justify-content: center;
align-items: center;
}
.mountain {
width: 40px;
height: 30px;
background-color: #a0a0a0;
clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
}
.dots {
text-align: center;
margin-bottom: 20px;
}
.dot {
height: 8px;
width: 8px;
background-color: #bbb;
border-radius: 50%;
display: inline-block;
margin: 0 5px;
}
.login-form input[type="text"],
.login-form input[type="password"] {
width: 100%;
padding: 10px;
margin-bottom: 10px;
border: 1px solid #ddd;
border-radius: 5px;
}
.remember-me {
margin-bottom: 20px;
}
.login-form button {
width: 100%;
padding: 10px;
background-color: #4caf50;
color: white;
border: none;
border-radius: 5px;
cursor: pointer;
}
.arrow {
float: right;
}
.links {
text-align: center;
margin-top: 20px;
font-size: 12px;
}
.links a {
color: #666;
text-decoration: none;
display: block;
margin-bottom: 5px;
}
範例二：製作托特塔羅抽卡測驗網頁
請Claude幫我製作一個托特塔羅抽卡測驗網頁
生成結果，可以點擊抽卡，但是沒有顯示卡片的說明
所以再請Claude幫我加入抽卡結果說明
就完成了簡易的托特塔羅抽卡網站了
以下是生成畫面的code
<!DOCTYPE html>
<html lang="zh-TW">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>托特塔羅抽卡測驗</title>
<style>
body {
font-family: Arial, sans-serif;
text-align: center;
background-color: #f0f0f0;
padding: 20px;
}
#card-container {
margin-top: 20px;
}
#card {
width: 200px;
height: 300px;
border: 1px solid #000;
margin: 0 auto;
background-color: #fff;
display: flex;
justify-content: center;
align-items: center;
font-size: 18px;
font-weight: bold;
}
#explanation {
margin-top: 20px;
max-width: 600px;
margin-left: auto;
margin-right: auto;
text-align: left;
}
button {
margin-top: 20px;
padding: 10px 20px;
font-size: 16px;
}
</style>
</head>
<body>
<h1>托特塔羅抽卡測驗</h1>
<div id="card-container">
<div id="card">點擊抽卡按鈕開始</div>
</div>
<button onclick="drawCard()">抽卡</button>
<div id="explanation"></div>
<script>
const cardExplanations = {
"愚者": "代表新的開始、冒險、自由和無限可能。提醒您保持開放的心態，勇於嘗試新事物。",
"魔術師": "象徵創造力、技能和意志力。暗示您擁有實現目標的所有工具，只需要付諸行動。",
"女祭司": "代表直覺、內在智慧和潛意識。建議您信任自己的感覺，聆聽內心的聲音。",
"女皇": "象徵豐饒、感性和創造力。提醒您關注自己的情感需求，享受生活的美好。",
"皇帝": "代表權威、結構和控制。暗示您需要建立秩序，或者面對生活中的權威人物。",
"教皇": "象徵精神指引、傳統和信仰。建議您尋求指導或遵循傳統價值觀。",
"戀人": "代表選擇、和諧和人際關係。提醒您關注重要的關係，或面臨重要的決定。",
"戰車": "象徵意志力、決心和勝利。鼓勵您堅持自己的目標，克服障礙。",
"力量": "代表內在力量、勇氣和自信。提醒您相信自己有能力應對挑戰。",
"隱者": "象徵內省、獨處和智慧。建議您花時間獨處，尋找內心的答案。",
"命運之輪": "代表變化、機會和命運。提醒您生活中的起起落落，接受改變。",
"正義": "象徵公平、平衡和誠實。鼓勵您做出公正的決定，保持誠實。",
"吊人": "代表犧牲、新視角和放下。建議您換個角度看問題，或者放下某些東西。",
"死神": "象徵結束、變化和轉型。提醒您某些事物需要結束，以便新的開始。",
"節制": "代表平衡、調和和耐心。鼓勵您在生活中尋找平衡，保持耐心。",
"魔鬼": "象徵誘惑、執著和物質主義。提醒您注意自己的慾望和依戀。",
"高塔": "代表突然的變化、崩塌和啟示。暗示您可能面臨意外的改變或頓悟。",
"星星": "象徵希望、靈感和更新。鼓勵您保持樂觀，相信美好的未來。",
"月亮": "代表直覺、幻想和恐懼。提醒您面對內心的恐懼，相信自己的直覺。",
"太陽": "象徵快樂、活力和成功。預示著積極的結果和喜悅的時光。",
"審判": "代表重生、覺醒和內在呼喚。鼓勵您聆聽內心的聲音，作出重要決定。",
"世界": "象徵完成、統一和成就。代表一個週期的結束和新週期的開始。"
};
function drawCard() {
const cardElement = document.getElementById('card');
const explanationElement = document.getElementById('explanation');
const cards = Object.keys(cardExplanations);
const randomCard = cards[Math.floor(Math.random() * cards.length)];
cardElement.textContent = randomCard;
explanationElement.innerHTML = `<h3>${randomCard}牌的含義：</h3><p>${cardExplanations[randomCard]}</p>`;
}
</script>
</body>
</html>
總結
Claude 3.5 Sonnet生成速度相當快，在生成程式碼方面表現出色，能夠理解複雜的需求，並生成高質量、結構良好的程式碼。當我要求新增功能時，它能根據我的要求進行擴展，最後附上程式碼說明，這對於不熟悉程式語言的開發人員來說非常有幫助。
═══════════════
嗨，我是原來可以這樣做的Sunny
我正嘗試將我學習的知識轉化成文字
與你分享，一同成長
如果你喜歡我的內容
動動手指點個愛心或留言與我分享你的想法
想學習更多知識嗎，追蹤 @dowayworks
也歡迎分享給朋友一起學習唷
感謝你閱讀完這篇內容，期待與你一同進步
留言0
查看全部
原來可以這樣做沙龍 的其他內容
你可能也想看
防曬產品係數測試報告彙整(2024年)從2014年起，自己對於市售防曬產品的效能產生了濃厚的興趣。因為當時候發現不少產品的防曬係數其實標示是有問題的，像是原本應該是人體測試的SPF與PA數值，實際上沒有做，只用機器測試的數據來充當，但這兩者卻有很大的差異。像是防曬係數其實有強度、廣度與平均度三個面向需要一起判斷，但多數廠商並沒有完整標示
2023-04-27
「這太瘋狂了」Anthropic 發表地表最強 AI 模型，用戶實測超級會寫程式OpenAI 的 GPT-4o 才發表一個月，更強大的大語言模型又出現了。OpenAI 競爭對手 Anthropic 今宣布推出其最強的新視覺模型「Claude 3.5 Sonnet」，在性能方面擊敗世界上所有其他模型，而且比前一代 Claude 3 更快、更便宜。
2024-06-24
AMZN 1Q24 財報：Anthropic開始對AWS帶來有意義貢獻，雲端Cost Optimization似乎結束AMZN 1Q24 繳出亮眼財報，其中 AWS 成長超預期，跟上 Azure、Google Cloud 等出現強勁的 YoY 復甦，這顯示了企業在雲端上的成本優化 (Cost Optimization) 歷經了 2022、2023 這二年之後，已經見到了放鬆的跡象。
AMZN 1Q24 財報表
2024-05-02
Anthropic：集結 OpenAI 前員工，打造更安全的 AIHi 我是 VK~
這期我們來聊聊美國 AI 新創 Anthropic 的故事。他們當時為什麼會想要離開 OpenAI，決定出來創業？為什麼這麼在意 AI 安全性？
喜歡這期的內容，歡迎分享給朋友一起訂閱《VK 科技閱讀時間》，祝你今天一切順利~
如果你平常有在用聊天機器人 Claude 翻
2024-04-29
Anthropic為什麼要自己挑戰越獄？大型語言模型（LLM）在商業正式使用上，「幻覺」和「越獄」是兩個很關鍵的問題。AI模型巨頭Anthropic自行發佈了一套Many-shot jailbreaking 的越獄技術，除了公開越獄的方式，也讓其他AI 開發人員了解這個漏洞，同時對Anthropic的系統上也做了相應措施。
2024-04-11
Amazon Bedrock正式引入Anthropic的Claude 3！趕緊來體驗強大的視覺能力！Anthropic Claude 3擁有先進的視覺能力，可以處理圖像數據並幫助使用者更好理解圖表、圖形和照片。通過使用Claude Messages API，開發虛擬助手應用程序以及為模型構建多模態prompt，你可以讓模型描述圖片中的內容。
2024-03-24
AWS與Anthropic深入合作 Amazon Bedrock再添Claude 3模型
Amazon Web Services（AWS）宣布致力於AI安全和研究的公司Anthropic的模型Claude 3系列將於Amazon Bedrock提供服務。Claude 3系列模型具備業界領先的準確性、效能、速度和成本優勢。這一進展將強化各種規模的企業
2024-03-19
最經濟實惠的AI模型！OpenAI「七叛徒」所創立的公司Anthropic 推出Claude 3 Haiku 模型Anthropic 發布了 Claude 3 Haiku，這是其智慧等級中速度最快且最實惠的 AI 模型。 Haiku 擁有最先進的視覺功能和在產業基準中最強大的性能，被譽為適用於各種企業應用的多功能解決方案。
2024-03-18
【2017舊作】【照夜白內心戲系列】《Anthropology》累
做不了壞人
又不是個好人
其實根本也就討厭人
卻是個人
－貓落《廢言錄》－
2023-12-26
AIAI是沒有「心」的，他能取代的就是那些僅僅在用「頭腦」的工作。頭腦是台機器，他擅長一切理性的⋯⋯計算、邏輯、資訊。但頭腦沒有心能夠去體會美，沒有心能夠去體會愛，AI可以畫出看似美的畫，但是他們並不是真的知道美；可以說出看似理解愛的文字，但是並不是真的理解愛
2023-12-23
亞馬遜宣布40億美元投資人工智慧公司Anthropic亞馬遜表示，已同意投資人工智慧公司 Anthropic 40 億美元，這是科技巨頭在人工智慧軍備競賽中，爭奪優勢的最新一筆大型新創企業投資。根據協議，Anthropic將使用其定製晶片來建構和部署其人工智慧軟體。亞馬遜還同意將Anthropic的技術納入其業務產品中。
熟悉該交易的人士稱，隨著時間的
2023-09-26