Νέα

Χρησιμοποίησα το POE για να αναπαράγω ένα μικρό παιχνίδι, δυσκολίας: zero|AI φρέσκο ​​τεστ

2024-07-16

한어Русский языкEnglishFrançaisIndonesianSanskrit日本語DeutschPortuguêsΕλληνικάespañolItalianoSuomalainenLatina


Συγγραφέας: Salt and Pepper Jade Rabbit
Email|[email protected]

Όταν κυκλοφόρησε το Claude 3.5 Sonnet, ενημερώθηκε και η λειτουργία της επίδειξης Artifacts.

Όσον αφορά τα Artifacts, επιτρέπει στους χρήστες να δημιουργούν και να αναφέρουν μεγάλες ποσότητες ανεξάρτητου περιεχομένου στις συνομιλίες.

Όταν ρωτήσαμε τον Claude για το "Αποσπάσματα κώδικα, έγγραφα κειμένου ή σχέδια ιστότοπων» και άλλο περιεχόμενο, τα Artifacts εμφανίζονται σε ένα αποκλειστικό παράθυρο, που εμφανίζονται δίπλα-δίπλα με τη συνομιλία, εάν η έξοδος δεν είναι ικανοποιητική, μπορούμε αμέσως να τροποποιήσουμε, να επαναλάβουμε και να βελτιώσουμε τη δημιουργία του Claude.


Η εικόνα δείχνει το εφέ HTML που δημιουργήθηκε από την Προεπισκόπηση μέσω διαλόγου με τον Claude 3.5 Sonnet στο Poe. Διεύθυνση διαλόγου: https://poe.com/s/YEms220OFPLfoZhPKfLI

Τώρα η αναμονή έφτασε επιτέλουςΟ Poe ενημέρωσε επίσημα τη λειτουργία Προεπισκόπησης, το εφέ είναι παρόμοιο με την επίδειξη των Artifacts σε πραγματικό χρόνο και υποστηρίζει επίσης τη δημιουργία σε πραγματικό χρόνο τριών μοντέλων: Claude 3.5 Sonnet, ChatGPT-4o και Gemini 1.5 Pro.


Η εικόνα στα αριστερά δείχνει ενημερώσεις Σονέτου και τεχνουργημάτων Claude 3.5 και η εικόνα στα δεξιά δείχνει την Προεπισκόπηση του Πόε

Διακόπτοντας μια πρόταση, εδώ είναι μια σύντομη εξήγησηΤι είναι ο Πόε;

Το Poe είναι μια πλατφόρμα AI που κυκλοφόρησε από την Quora, μια βορειοαμερικανική "Zihu" (κοινότητα ερωτήσεων και απαντήσεων), στα τέλη του 2022. Οι χρήστες μπορούν να επικοινωνούν με διαφορετικά μοντέλα AI μέσω αυτής, συμπεριλαμβανομένων γνωστών μοντέλων όπως το ChatGPT και ο Claude. Η αρχική σχεδιαστική πρόθεση του Poe είναι να παρέχει μια διαφορετική πλατφόρμα συνομιλίας, επιτρέποντας στους χρήστες να επιλέξουν αυτό που τους ταιριάζει καλύτερα από πολλά μοντέλα τεχνητής νοημοσύνης για αλληλεπίδραση είτε πρόκειται για ερωτήσεις, είτε για βοήθεια με τον προγραμματισμό είτε για χαλαρές συνομιλίες ικανοποιήστε το. Όταν ο Poe ενημέρωσε τη λειτουργία επίδειξης Προεπισκόπηση, ήμουν τόσο χαρούμενος!


Έχοντας πει τόσα πολλά, ανυπομονώ να ρίξουμε μια ματιά σε μερικές πρακτικές περιπτώσεις.


1

Σενάριο 1: Δημιουργήστε μια όμορφη ιστοσελίδα παιχνιδιού

Στο Διαδίκτυο, βλέπουμε συχνά διάφορες ιστοσελίδες συλλογής εργαλείων. Αν υπήρχε ένα εργαλείο που θα μπορούσε να μας βοηθήσει να δημιουργήσουμε εύκολα τη δική μας ιστοσελίδα οπτικής συλλογής, δεν θα εξοικονομούσε πολύ χρόνο προγραμματισμού; Πρόσφατα, ανακάλυψα έναν ιστότοπο παιχνιδιού Κάθε φορά που κάνω κλικ σε αυτό, νιώθω σαν να ανοίγω ένα τυφλό κουτί. Υπάρχουν διάφορα παιχνίδια, εργαλεία και πειράματα δικτύου.

Απλώς αναρωτιόμουν: Μπορώ να χρησιμοποιήσω τη λειτουργία Προεπισκόπησης του Poe;Δημιουργήστε μια ζωντανή δοκιμαστική σελίδα όπως αυτή , ή ακόμα και να δημιουργήσετε έναν ιστότοπο συλλογής εργαλείων; Για να επαληθεύσω αυτήν την ιδέα, αποφάσισα να τη δοκιμάσω φτιάχνοντας πρώτα μια στατική σελίδα. Αυτό είναι το βασικό πρώτο βήμα!

Χρησιμοποιώ τον Πόε απευθείας για να μιλήσω με το Σονέτο Claude 3.5. Αυτό που ξεκίνησε ως μια καθαρά κειμενική ερώτηση δημιούργησε κείμενο και λύσεις.


Αργότερα πρόσθεσα "Κάντε προεπισκόπηση της οθόνης απευθείας στις Προεπισκοπήσεις”, το αποτέλεσμα σε πραγματικό χρόνο ήταν αμέσως εμφανές και το αποτέλεσμα ήταν πραγματικά καλό.

Συμβουλή: https://toms.toys/ Επισκεφθείτε αυτήν τη σελίδα, δημιουργήστε ένα εκπαιδευτικό παιχνίδι και εμφανίστε το απευθείας στις προεπισκοπήσεις.


Αφού το δημιούργησα, προσπάθησα να κάνω κλικ στις κόκκινες λέξεις, αλλά διαπίστωσα ότι το κλικ δεν μετακινήθηκε, επομένως η ιστοσελίδα που δημιουργήθηκε ήταν μια στατική ιστοσελίδα, αλλά έμοιαζε κατά 80% Το χρώμα του λογότυπου ταίριαζε βασικά και το άλλα κουτιά ευρετηρίου ήταν επίσης πολύ καθαρά, τουλάχιστον είχαν τη γεύση της αρχικής έκδοσης.


Ρεκόρ συνομιλίας: https://poe.com/s/Pe9cXFpmFHQqPAZhZOgU

Τώρα με αυτό το θεμέλιο, μπορώ ήδη να δημιουργήσω έναν αποκλειστικό ιστότοπο εργαλείων μόνος μου. Φανταστείτε ότι όλα τα είδη πρακτικών εργαλείων συγκεντρώνονται σε έναν προσαρμοσμένο ιστότοπο και μπορείτε να τον χρησιμοποιήσετε με ένα κλικ οποτεδήποτε, οπουδήποτε είναι πραγματικά βολικό και ωραίο!

1

Σενάριο 2: Επίδειξη ανάλυσης οικονομικών εκθέσεων NVIDIA 2024

Στο παρελθόν, πολλά αποτελέσματα οικονομικών εκθέσεων ανάλυσης τεχνητής νοημοσύνης ήταν κείμενο. Τώρα προσπαθούμε να χρησιμοποιήσουμε γραφήματα για να δείξουμε το αποτέλεσμα.

Προτάσεις:

Μπορείτε να αναλύσετε τις πληροφορίες; https://investor.nvidia.com/news/press-release-details/2024/NVIDIA-Announces-Financial-Results-for-Fourth-Quarter-and-Fiscal-2024/ και μετατρέψτε το σε ένα εύπεπτο διαδραστικό Demo για βοήθεια το καταλαβαινω

Το Poe's Preview αρχικά χρησιμοποίησε μια απλή διαδραστική επίδειξη για να δείξει τους κύριους οικονομικούς δείκτες της NVIDIA. Κάνοντας κλικ σε διαφορετικά κουμπιά, μπορείτε να προβάλετε γραφήματα εσόδων, κερδών και κερδών ανά μετοχή. Είναι αρκετά ισχυρό, καθόλου κατώτερο από τα Artifacts.

Η βελτιστοποιημένη επαγγελματική έκδοση δεν συγκρίνει μόνο διάφορους δείκτες, αλλά παρέχει επίσης μια ολοκληρωμένη επισκόπηση της οικονομικής κατάστασης της NVIDIA, συμπεριλαμβανομένης της παρουσίασης δεδομένων και της επαγγελματικής ανάλυσης. Το συνολικό αποτέλεσμα δεν είναι κακό.

Ρεκόρ συνομιλίας: https://poe.com/s/NaFg8czE3NKSDu1vehH1

1

Σενάριο 3: Κατασκευή καρτών γνώσεων χημικών

Θυμάμαι ότι μια από τις περιπτώσεις διαδικτυακών εφαρμογών που δημιουργούνται από τον επίσημο λογαριασμό του Πόε είναιΚάρτες γνώσεωνFlashcards:

https://poe.com/s/HDAXQjBX9qmsInjjgV4X, γιατί να μην το χρησιμοποιήσετε ως πρωτότυπο για να φτιάξετε μια κάρτα γνώσεων χημείας;


Η παραγωγή των καρτών είναι επίσης πολύ απλή Μετά από μερικές βασικές επαναλήψεις, οι κύριες επαναλήψεις και τροποποιήσεις είναι οι εξής:

  • Βασικές πληροφορίες κειμένου:Οι κάρτες έχουν έννοιες στο μπροστινό μέρος και επεξηγήσεις των εννοιών στο πίσω μέρος.

  • Λέξη:Το προηγούμενο και το επόμενο κείμενο διακρίνονται κατά μέγεθος, χρώμα φόντου κ.λπ.

  • τόνος:Ο συνολικός χρωματικός τόνος είναι Moran, που φαίνεται πιο άνετος.

Διάλογος εφέ κάρτας: https://poe.com/s/1TgDhUkoKmhjMq75yXhF

Οι προσεκτικοί φίλοι μπορούν να δουν ότι εκτός από την ανατροπή και την αλληλεπίδραση, πρόσθεσα επίσηςUser ID, σε πραγματικό χρόνο,Αυξήθηκε η μοναδικότητα και η φύση της κάρτας σε πραγματικό χρόνο.


1

Σκηνή 4: Προσομοίωση κινουμένων σχεδίων του κύκλου του νερού

Σήμερα θα ονειρευόμαστε πίσω στις μέρες του γυμνασίου μας και θα δημιουργήσουμε μια διαδικασία animation του κύκλου του νερού, έτσι ώστε η σελίδα να μπορεί να αναπαράγει αυτόματα εφέ κινούμενων σχεδίων.

Προτάσεις:

Δημιουργήστε μια κινούμενη εικόνα χρησιμοποιώντας το React για να δείξετε πώς κυκλοφορεί το νερό, εάν είναι πιο περίπλοκο, προσθέστε emoji ή svg.

Χρειάζομαι ένα στοιχείο React για μια διαδικασία βρόχου νερού. Στα αριστερά υπάρχει μια κινούμενη εικόνα που δείχνει τα τέσσερα στάδια της εξάτμισης, της συμπύκνωσης, της καθίζησης και της συλλογής στα δεξιά είναι η αντίστοιχη περιγραφή κειμένου. Χρησιμοποιήστε το Web Speech API για να προσθέσετε λειτουργία αυτόματης αναπαραγωγής ομιλίας, έτσι ώστε το περιεχόμενο της ομιλίας να είναι συνεπές με το κείμενο. Κινούμενη με χρήση SVG, κάθε στάδιο διαρκεί 8 δευτερόλεπτα. Ο συνολικός σχεδιασμός πρέπει να είναι συνοπτικός, σαφής και κατανοητός. Βεβαιωθείτε ότι τα κινούμενα σχέδια είναι πιο ομαλά και το κείμενο πιο λεπτό.Και κάντε προεπισκόπηση της οθόνης απευθείας στις Προεπισκοπήσεις

Διαδικασία διαλόγου: https://poe.com/s/OujTxBMnSknxHaqmBhXs

ΟΧΙ μονοΑυτόματη επίδειξη κινουμένων σχεδίων, δίπλα στοΜια συμπυκνωμένη περιγραφή της διαδικασίας του κύκλου του νερού , πολύ σαφής και ευδιάκριτος. Όταν οι δάσκαλοι διδάσκουν σύνθετες έννοιες, μπορούν εύκολα να δημιουργήσουν παρουσιάσεις ενώ προετοιμάζουν μαθήματα, γρήγορα και διαισθητικά. Αυτό είναι ένα τεχνούργημα που εξοικονομεί χρόνο και εξοικονομεί εργασία για τους δασκάλους!

1

Σενάριο 5: Δημιουργήστε τον δικό σας ιστότοπο εργαλείων αποσυμπίεσης

Πραγματοποιούσα περιήγηση στον ιστότοπο πριν από δύο ημέρες και βρήκα έναν ενδιαφέροντα ιστότοπο. Εμφανίζει μια σειρά από εφέ ποντικιού που υλοποιούνται μέσω JavaScript, τα οποία μπορούν να ακολουθήσουν την κίνηση του ποντικιού ή το άγγιγμα του δακτύλου σας. Μπορείτε να κάνετε κλικ οπουδήποτε για να αλλάξετε διαφορετικά εφέ, όπως εφέ ουράνιου τόξου κ.λπ. Στη συνέχεια, δοκιμάστε να χρησιμοποιήσετε τη λειτουργία προεπισκόπησης του Poe.

Προτάσεις:

Δημιουργήστε ένα τεχνούργημα αποσυμπίεσης, αυτές είναι οι πληροφορίες:

https://cursoreffects.com/

https://github.com/tholman/cursor-effects

Πρώτη φορά απλό στυλ:


Το στυλ της πρώτης έκδοσης ήταν πολύ απλό, οπότε ζήτησα από τον Claude 3.5 Sonnet να το ομορφύνει.Έχουν προστεθεί πράσινα κουμπιά και λευκό φόντο και τα εφέ του ποντικιού έχουν αυξηθεί από 4 σε 11.


Αλλά εκείνη τη στιγμή, διαπίστωσα ότι το "κείμενο" και τα "εφέ δρομέα" καταλάμβαναν ολόκληρη την οθόνη και δεν μπορούσα να δω καλύτερα το αποτέλεσμα των κλικ του ποντικιού. Συνεχίστε να προσαρμόζεστε και πείτε στον Claude 3.5 Sonnet:Ελευθερώστε τον μεσαίο χώρο ενώ συνεχίζετε να ομορφαίνεις το οπτικό αποτέλεσμα, υπάρχουν δύο διαφορετικά στυλ εφέ παρακάτω.

Θα διαπιστώσουμε ότι το χρώμα αυτής της έκδοσης χρησιμοποιείχρώμα ντεγκραντέ, πολύ αναζωογονητικό ταυτόχρονα, η μεσαία θέση απελευθερώνεται και το συνολικό αποτέλεσμα είναι αρκετά καλό.


ροζ ντεγκραντέ εφέ


εφέ μπλε ντεγκραντέ

Στην πραγματικότητα, το παραπάνω εφέ είναι αρκετά ικανοποιητικό, αλλά θέλω ολόκληρη η σελίδα να είναι πιο συνοπτική. Ψάχνοντας προσεκτικά θα βρούμε:

  • Υπάρχει πολύ κείμενο σε ολόκληρη τη σελίδα και οι δύο γραμμές μικρών χαρακτήρων στη μέση έχουν αλληλεπικαλυπτόμενες σημασίες.

  • Το ψευδώνυμο των ειδικών εφέ του δρομέα παρακάτω καταλαμβάνει πολύ χώρο και προσελκύει υπερβολική προσοχή. Μπορεί να επαναληφθεί σε ένα κουμπί που αλλάζει καθώς κάνει κλικ ο παίκτης.

Στη συνέχεια, συνέχισα να λέω στο Σονέτο Claude να είναι πιο συνοπτικό και σαφές. Το τελικό αποτέλεσμα είναι το ακόλουθο.


Μετά την τελική βελτιστοποίηση, η γραμματοσειρά αντικαταστάθηκε με ένα πιο κατάλληλο στυλ.

Αυτο-κατασκευασμένο εργαλείο αποσυμπίεσης: https://poe.com/s/xPxoi0qCl4JVsXw3GxqV

1

Επιτέλους

Είτε πρόκειται για τον Πόε είτε για τον Κλοντ, η εμφάνιση του Προεπισκόπηση / Artifacts κάνει την οθόνηκείμενο, κώδικαςαπεικονίζω,Αυτό το βήμα γίνεται πιο απλό και πιο εύκολο στην εφαρμογή.


  • Για τους προγραμματιστές, τα Artifacts μπορούν να δημιουργήσουν και να επιδιορθώσουν κώδικα, μειώνοντας τον χρόνο μη αυτόματης κωδικοποίησης.

  • Για ομαδική συνεργασία, η δυνατότητα προβολής, επεξεργασίας και δημιουργίας περιεχομένου σε πραγματικό χρόνο στην ίδια πλατφόρμα μειώνει σημαντικά την απώλεια μεταξύ της μετάδοσης πληροφοριών.

  • Για εκπαιδευτικούς, χρησιμοποιήστε το Claude 3.5 Sonnet για να δημιουργήσετε περιεχόμενο διδασκαλίας και παρουσιάσεις για να απλοποιήσετε τη διαδικασία παραγωγής. Οι μαθητές μπορούν πιο εύκολα να έχουν πρόσβαση σε πόρους εκμάθησης και να χρησιμοποιούν επιδείξεις σε πραγματικό χρόνο για να ενισχύσουν το ενδιαφέρον τους για μάθηση.

Είτε πρόκειται για προγραμματιστές, για ομαδική συνεργασία ή για εκπαιδευτικούς, η αποτελεσματικότητα της καθημερινής εργασίας και ζωής έχει βελτιωθεί σημαντικά. Υπάρχουν πολλές τέτοιες σκηνές στη ζωή...


Αφού τελείωσα την κατασκευή του εργαλείου αποσυμπίεσης, μοιράστηκα απευθείας το σπιτικό εργαλείο αποσυμπίεσης με τον φίλο μου προγραμματιστή. Αυτή ήταν μια συζήτηση μαζί του.


Είπε: «Θα έπαιρνε μια μέρα για να γράψω έναν τέτοιο κώδικα», αλλά σήμερα αφιέρωσα μόνο μισή ώρα το πολύ σε αυτόν (ΥΓ: Αρχάριος κωδικοποιητής) Δεν είναι αυτή η αρχή ενός είδους τεχνητής νοημοσύνης που μπαίνει στα σπίτια των απλών ανθρώπων;

Ανυπομονούμε να μπει περισσότερη τεχνητή νοημοσύνη στα σπίτια των απλών ανθρώπων και στο όραμα όλων στο μέλλον.

Βιβλιογραφικές αναφορές:

  1. Επίσημος ιστότοπος του Poe: https://poe.com/

  2. Εισαγωγή ενημέρωσης Σονέτο Claude 3.5:

    https://www.anthropic.com/news/claude-3-5-sonnet

  3. Αρχικό τεχνούργημα αποσυμπίεσης: https://cursoreffects.com/

  4. Σταθμός συλλογής και συγκέντρωσης υποθέσεων Claude Artifacts Showcase:

    https://claudeartifacts.com/?category=Όλα

Αναφορά περίπτωσης εφαρμογής ιστού που δημιούργησε επίσημα ο Poe:

  1. Διαδραστική παρουσίαση: https://poe.com/s/NlX2WRElDUvtuuMSFrZq

  2. Κάρτες γνώσεων Flashcards: https://poe.com/s/HDAXQjBX9qmsInjjgV4X

  3. Ηλεκτρονική μηχανή τυμπάνων Drum Machine: https://poe.com/s/G4HshkCQCaXVfg0ndPZK

  4. Μεγάλος επιταχυντής χρωμάτων: https://poe.com/s/neKbyqEJYUtiRjeC6b5f