مقدمة
يمكن الارتقاء بتطبيقات الويب الحديثة إلى مستوى أعلى من خلال دمج الذكاء الاصطناعي. تركز هذه الدورة على التطوير المتقدم للروبوتات متعددة الاستخدامات التي تستخدم معالجة اللغة الطبيعية، وتوليد الصور، والتعرف على الكلام. توفر هذه الروبوتات تجربة مستخدم فريدة، وتشرك المستخدمين عبر طرق تفاعل متعددة.
يُطوّر هذا البرنامج التعليمي بوتًا متعدد الجوانب باستخدام نموذج Django Big Language وOpenAI للذكاء الاصطناعي الحواري، وWhisper لنسخ الكلام بدقة، وDALL-E لتوليد الصور. يصف البرنامج بناء تطبيق ويب يُنشئ قصصًا مصحوبة بصور. يُمكن للمستخدمين تحديد موضوع القصة صوتيًا أو نصيًا، ويستجيب التطبيق بقصة مُولّدة مُزينة بصور.
بنهاية هذا البرنامج التعليمي، ستكون قد أنشأت تطبيقًا قادرًا على فهم مُدخلات المستخدم والاستجابة لها بأشكال مُختلفة، بما في ذلك النصوص والصوت والصور. هذا يُعزز بشكل كبير تفاعل المستخدم مع التطبيق، ويجعله أكثر سهولة في الاستخدام وبديهية.
المتطلبات الأساسية
- فهم أساسي لبايثون وجانجو
- مفتاح API الخاص بـ OpenAI: يتطلب هذا البرنامج التعليمي التفاعل مع نماذج GPT-4 وDALL-E الخاصة بـ OpenAI، والتي تتطلب مفتاح API من OpenAI.
- همس
- حزمة OpenAI Python
بمجرد تنشيط بيئتك، قم بتشغيل الأمر التالي لتثبيت حزمة OpenAI Python:
(env)sammy@ubuntu:$ pip install openaiالخطوة 1 - دمج OpenAI Whisper للتعرف على الكلام
في هذه الخطوة، ستقوم بإعداد OpenAI Whisper في تطبيق Django الخاص بك لتمكينه من تحويل الكلام إلى نص. Whisper هو نموذج قوي للتعرف على الكلام، قادر على توفير نسخ دقيقة، وهي ميزة مهمة لروبوتنا متعدد الاستخدامات. بدمج Whisper، سيتمكن تطبيقنا من فهم مدخلات المستخدم الصوتية.
أولاً، تأكد من العمل في مجلد مشروع Django. بعد الدروس التمهيدية، ستحتاج إلى إعداد مشروع Django لهذا التكامل. افتح نافذة الأوامر، وانتقل إلى مجلد مشروع Django، وتأكد من تفعيل بيئتك الافتراضية:
sammy@ubuntu:$ cd path_to_your_django_project
sammy@ubuntu:$ source env/bin/activateإعداد Whisper في تطبيق Django الخاص بك
ما يجب فعله الآن هو إنشاء دالة تستخدم Whisper لتحويل الملفات الصوتية إلى نص. أنشئ ملف بايثون جديد باسم whisper_transcribe.py.
(env)sammy@ubuntu:$ touch whisper_transcribe.pyافتح ملف whisper_transcribe.py في محرر النصوص واكتب Whisper. بعد ذلك، لنُعرّف دالة تأخذ مسار ملف صوتي كمدخل، وتستخدم Whisper لمعالجة الملف، ثم تُرجع النص المكتوب:
import whisper
model = whisper.load_model("base")
def transcribe_audio(audio_path):
result = model.transcribe(audio_path)
return result["text"]في هذا المقطع، ستستخدم النموذج "الأساسي" للنسخ. يوفر Whisper نماذج مختلفة تناسب مختلف احتياجات الدقة والأداء. يمكنك بسهولة تجربة نماذج أخرى بناءً على احتياجاتك.
اختبار النسخ
لاختبار النسخ، احفظ ملفًا صوتيًا في مجلد مشروع Django. تأكد من أن الملف بتنسيق يدعمه Whisper (مثل MP3 وWAV). الآن، عدّل whisper_transcribe.py بإضافة الأسطر التالية في الأسفل:
# For testing purposes
if __name__ == "__main__":
print(transcribe_audio("path_to_your_audio_file"))قم بتشغيل whisper_transcribe.py باستخدام Python لرؤية نسخة من ملف الصوت الخاص بك في محطتك الطرفية:
(env)sammy@ubuntu:$ python whisper_transcribe.pyإذا تم إعداد كل شيء بشكل صحيح، فسترى النص المنقول في المحطة الطرفية. تُشكّل هذه الوظيفة أساسًا للتفاعلات الصوتية في بوتنا.
الخطوة 2 - إنشاء استجابات نصية باستخدام GPT-4
في هذه الخطوة، ستستخدم GPT-4 LLM لإنشاء استجابات نصية بناءً على مدخلات المستخدم أو نص الكلام المُنسوخ في الخطوة السابقة. بفضل نموذجه اللغوي الكبير، يُمكن لـ GPT-4 إنشاء استجابات متماسكة ومرتبطة بالسياق، مما يجعله خيارًا مثاليًا لتطبيقنا الروبوتي متعدد الوسائط.
قبل المتابعة، تأكد من تثبيت حزمة OpenAI Python في بيئتك الافتراضية كما هو موضح في المتطلبات الأساسية. يتطلب نموذج GPT-4 مفتاح API للوصول إليه، لذا تأكد من جاهزيته. يمكنك إضافة مفتاح API الخاص بـ OpenAI إلى متغيرات بيئتك بدلاً من إضافته مباشرةً إلى ملف Python:
(env)sammy@ubuntu:$ export OPENAI_KEY="your-api-key"إعداد إكمال الدردشة
انتقل إلى مجلد تطبيق Django وأنشئ ملف Python جديدًا باسم chat_completion.py. سيتواصل هذا البرنامج النصي مع نموذج GPT-4 لتوليد استجابات بناءً على النص المُدخل.
import os
from openai import OpenAI
client = OpenAI(api_key=os.environ["OPENAI_KEY"])
def generate_story(input_text):
# Call the OpenAI API to generate the story
response = get_story(input_text)
# Format and return the response
return format_response(response)يُنشئ هذا المقتطف من الكود أولاً مفتاح واجهة برمجة التطبيقات المطلوب للمصادقة مع خدمات OpenAI. ثم يستدعي دالة منفصلة، get_story، لاستدعاء واجهة برمجة التطبيقات مع OpenAI للقصة، ثم دالة أخرى، format_response، لتنسيق استجابة واجهة برمجة التطبيقات.
الآن، لنركز على دالة get_story. أضف ما يلي إلى أسفل ملف chat_completion.py:
def get_story(input_text):
# Construct the system prompt. Feel free to experiment with different prompts.
system_prompt = f"""You are a story generator.
You will be provided with a description of the story the user wants.
Write a story using the description provided."""
# Make the API call
response = client.chat.completions.create(
model="gpt-4",
messages=[
{"role": "system", "content": system_prompt},
{"role": "user", "content": input_text},
],
temperature=0.8
)
# Return the API response
return responseفي هذه الوظيفة، تقوم أولاً بتعيين أمر النظام، الذي يخبر النموذج بالمهمة التي يحتاج إلى تنفيذها، ثم تطلب من واجهة برمجة تطبيقات ChatCompletion إنشاء قصة باستخدام نص إدخال المستخدم.
أخيرًا، يمكنك تنفيذ دالة format_response. أضف ما يلي إلى أسفل ملف chat_completion.py:
def format_response(response):
# Extract the generated story from the response
story = response.choices[0].message.content
# Remove any unwanted text or formatting
story = story.strip()
# Return the formatted story
return storyاختبار الاستجابات الناتجة
لاختبار إنشاء النص، قم بتعديل chat_completion.py عن طريق إضافة بضعة أسطر في الأسفل:
# For testing purposes
if __name__ == "__main__":
user_input = "Tell me a story about a dragon"
print(generate_story(user_input))لرؤية الاستجابة الناتجة في محطتك الطرفية، قم بتشغيل chat_completion.py باستخدام Python:
(env)sammy@ubuntu:$ python chat_completion.pyبناءً على المُوجِّه، من المُفترَض أن ترى استجابةً إبداعيةً من GPT-4. جرِّب مُدخلاتٍ مُختلفةً لرؤية استجاباتٍ مُختلفة.
في الخطوة التالية، قم بإضافة الصور إلى القصص التي تم إنشاؤها.
الخطوة 3 – إنشاء الصور باستخدام DALL-E
تم تصميم DALL-E لإنشاء صور دقيقة من الرسائل النصية، مما يتيح لروبوتك متعدد الأوجه تعزيز القصص بالإبداع البصري.
أنشئ ملف بايثون جديدًا باسم image_generation.py في تطبيق Django. يستخدم هذا البرنامج النصي نموذج DALL-E لتوليد الصورة:
(env)sammy@ubuntu:$ touch image_generation.pyدعنا ننشئ دالة في image_generation.py ترسل إشعارًا إلى DALL-E وتسترد الصورة المولدة:
import os
from openai import OpenAI
client = OpenAI(api_key=os.environ["OPENAI_KEY"])
def generate_image(text_prompt):
response = client.images.generate(
model="dall-e-3",
prompt=text_prompt,
size="1024x1024",
quality="standard",
n=1,
)
image_url = response.data[0].url
return image_urlتُرسل هذه الدالة طلبًا إلى نموذج DALL-E يُحدد أمر النص، وعدد الصور المراد توليدها (n=1)، وحجمها. ثم تستخرج الدالة عنوان URL للصورة المُولَّدة وتُرجعه.
اختبار النص
لتوضيح استخدام هذه الوظيفة في مشروع Django، يمكنك إضافة المثال التالي في أسفل ملف image_generation.py الخاص بك:
# For testing purposes
if __name__ == "__main__":
prompt = "Generate an image of a pet and a child playing in a yard."
print(generate_image(prompt))قم بتشغيل image_generation.py باستخدام Python لإنشاء صورة استنادًا إلى الأمر المعطى:
(env)sammy@ubuntu:$ python image_generation.pyإذا نجح تشغيل البرنامج النصي، فسترى رابط الصورة المُولّدة في المحطة الطرفية. يمكنك بعد ذلك عرض الصورة بالانتقال إلى هذا الرابط في متصفح الويب.
في الخطوة التالية، ستقوم بدمج التعرف على الكلام مع إنشاء النصوص والصور لتوفير تجربة مستخدم سلسة.
الخطوة 4 - دمج الأساليب للحصول على تجربة سلسة
في هذه المرحلة، سوف تقوم بدمج الإمكانات التي تم تطويرها في المراحل السابقة لتوفير تجربة مستخدم سلسة.
سيتمكن تطبيق الويب الخاص بك من معالجة النصوص والإدخالات الصوتية من المستخدمين وإنشاء القصص واستكمالها بالصور ذات الصلة.
إنشاء عرض موحد
أولاً، تأكد من تنظيم مشروع Django لديك، ومن وجود ملفات whisper_transcribe.py وchat_completion.py وimage_generation.py في مجلد تطبيق Django. الآن، ستنشئ عرضًا يجمع هذه المكونات.
افتح ملف views.py واستورد الوحدات والوظائف اللازمة. ثم أنشئ عرضًا جديدًا باسم get_story_from_description:
import uuid
from django.core.files.storage import FileSystemStorage
from django.shortcuts import render
from .whisper_transcribe import transcribe_audio
from .chat_completion import generate_story
from .image_generation import generate_image
# other views
def get_story_from_description(request):
context = {}
user_input = ""
if request.method == "GET":
return render(request, "story_template.html")
else:
if "text_input" in request.POST:
user_input += request.POST.get("text_input") + "\n"
if "voice_input" in request.FILES:
audio_file = request.FILES["voice_input"]
file_name = str(uuid.uuid4()) + (audio_file.name or "")
FileSystemStorage(location="/tmp").save(file_name, audio_file)
user_input += transcribe_audio(f"/tmp/{file_name}")
generated_story = generate_story(user_input)
image_prompt = (
f"Generate an image that visually illustrates the essence of the following story: {generated_story}"
)
image_url = generate_image(image_prompt)
context = {
"user_input": user_input,
"generated_story": generated_story.replace("\n", "<br/>"),
"image_url": image_url,
}
return render(request, "story_template.html", context)يسترجع هذا العرض النص و/أو الصوت المُدخل من المستخدم. في حال وجود ملف صوتي، يحفظه باسم فريد (باستخدام مكتبة uuid) ويستخدم دالة transcribe_audio لتحويل الصوت إلى نص. ثم يستخدم دالة gene_story لإنشاء استجابة نصية، ودالة gene_image لإنشاء صورة مُرتبطة. تُرسل هذه المخرجات إلى قاموس النصوص، الذي يُعرض بعد ذلك باستخدام story_template.html.
إنشاء قالب
ثم قم بإنشاء ملف يسمى story_template.html وأضف ما يلي:
<div style="padding:3em; font-size:14pt;">
<form method="post" enctype="multipart/form-data">
{% csrf_token %}
<textarea name="text_input" placeholder=" Describe the story you would like" style="width:30em;"></textarea>
<br/><br/>
<input type="file" name="voice_input" accept="audio/*" style="width:30em;">
<br/><br/>
<input type="submit" value="Submit" style="width:8em; height:3em;">
</form>
<p>
<strong>{{ user_input }}</strong>
</p>
{% if image_url %}
<p>
<img src="{{ image_url }}" alt="Generated Image" style="max-width:80vw; width:30em; height:30em;">
</p>
{% endif %}
{% if generated_story %}
<p>{{ generated_story | safe }}</p>
{% endif %}
</div>يتيح هذا النموذج البسيط للمستخدمين إرسال طلباتهم عبر رسالة نصية أو تحميل ملف صوتي. ثم يعرض النص والصورة الناتجين عن التطبيق.
إنشاء عنوان URL للعرض
الآن بعد أن أصبح لديك عرض get_story_from_description جاهزًا، يتعين عليك جعله متاحًا عن طريق إنشاء تكوين عنوان URL.
افتح ملف urls.py في تطبيق Django الخاص بك وأضف قالبًا لعرض get_story_from_description:
from django.urls import path
from . import views
urlpatterns = [
# other patterns
path('generate-story/', views.get_story_from_description, name='get_story_from_description'),
]اختبار التجربة الموحدة
يمكنك الآن زيارة http://your_domain/generate-story/ في متصفح الويب لديك. سيظهر لك النموذج المُعرّف في story_template.html. جرّب إرسال طلب نصي عبر حقل إدخال النص أو تحميل ملف صوتي باستخدام حقل إدخال الملف. بعد الإرسال، سيُعالج طلبك المُدخلات، ويُنشئ قصة وصورة مُرفقة، ويُعرضها على الصفحة.
على سبيل المثال، إليك مثال لقصة قصيرة: "أخبرني قصة عن حيوان أليف وطفل يلعبان في الفناء".“
من خلال إكمال هذه الخطوة، تكون قد أنشأت تطبيقًا يعالج ويستجيب لمدخلات المستخدم في أشكال مختلفة.
نتيجة
في هذا البرنامج التعليمي، نجحتَ في تطوير بوت متعدد الاستخدامات باستخدام Django، مع دمج إمكانيات Whisper للتعرف على الكلام، وGPT-4 لتوليد النصوص، وDALL-E لتوليد الصور. يستطيع برنامجك الآن فهم مُدخلات المستخدم والتفاعل معها بتنسيقات مُختلفة.
لمزيد من التطوير، يوصى باستكشاف إصدارات بديلة من نماذج Whisper وGPT وDALL-E، وتحسين تصميم واجهة المستخدم/تجربة المستخدم لتطبيقك، أو توسيع وظائف الروبوت لتشمل ميزات تفاعلية إضافية.
