Deepseek ArtifactsDeepseek Artifacts
返回代码库

打造逼真英语对话应用

4.0
en科技英语学习对话模拟应用开发

提示语

I want to create a great app in which 4 characters sitting on table with me and we are talking to each other and this conversation should be realistic. The four people are real like personalities like Shahrukh Khan,Katrina Kaif,Ms Dhoni and Maya Ali, I think you know about them and how they speak and their accent or voice you should exactly the same voices or accent and they realistically talk about different things and about their field and I am the one who is active in this conversation and want to learn English speaking through realistic talks

生成结果

import React from 'react';

class App extends React.Component {
  render() {
    return (
      <div className='App bg-gradient-to-r from-blue-500 to-purple-600 min-h-screen p-8'>
        <div className='max-w-6xl mx-auto'>
          <h1 className='text-4xl font-bold text-white mb-8'>Interactive English Learning</h1>
          <div className='grid grid-cols-1 md:grid-cols-2 gap-6'>
            <div className='bg-white p-6 rounded-lg shadow-lg'>
              <img src='https://placehold.co/300x300' alt='Shahrukh Khan' className='w-full h-48 object-cover mb-4 rounded-lg' />
              <h2 className='text-2xl text-gray-800 font-bold mb-2'>Shahrukh Khan</h2>
              <p className='text-gray-600'>Actor, Film Producer</p>
            </div>
            <div className='bg-white p-6 rounded-lg shadow-lg'>
              <img src='https://placehold.co/300x300' alt='Katrina Kaif' className='w-full h-48 object-cover mb-4 rounded-lg' />
              <h2 className='text-2xl text-gray-800 font-bold mb-2'>Katrina Kaif</h2>
              <p className='text-gray-600'>Actress, Model</p>
            </div>
            <div className='bg-white p-6 rounded-lg shadow-lg'>
              <img src='https://placehold.co/300x300' alt='Ms Dhoni' className='w-full h-48 object-cover mb-4 rounded-lg' />
              <h2 className='text-2xl text-gray-800 font-bold mb-2'>Ms Dhoni</h2>
              <p className='text-gray-600'>Cricketer, Captain</p>
            </div>
            <div className='bg-white p-6 rounded-lg shadow-lg'>
              <img src='https://placehold.co/300x300' alt='Maya Ali' className='w-full h-48 object-cover mb-4 rounded-lg' />
              <h2 className='text-2xl text-gray-800 font-bold mb-2'>Maya Ali</h2>
              <p className='text-gray-600'>Actress, Model</p>
            </div>
          </div>
          <div className='mt-8 bg-white p-6 rounded-lg shadow-lg'>
            <h3 className='text-xl text-gray-800 font-bold mb-4'>Conversation</h3>
            <p className='text-gray-600'>Engage in a realistic conversation with these personalities to improve your English speaking skills.</p>
          </div>
        </div>
        <footer className='text-center text-white mt-8'>© 2025 Interactive English Learning</footer>
      </div>
    );
  }
}

export default App;
Open on CodeSandboxOpen Sandbox

更多推荐

查看全部

智能AI安卓应用

科技en
4.0

Create applications ai for android the name app is a aw ai.eg the app can make photo and video the ai He must be smart and ai can speak Arabic

AI应用安卓开发智能语音2025/6/20

企业家应用功能解析

科技en
4.0

I would like an application called Entrepreneurs. This application is for accounting or statement of accounts for public companies. The first thing in this application is the registration page and the login page. It consists of two pages. The first page that appears to the user is the login. If the user does not have an account, please also register and add verification of the validity of this data. After the user registers with the email and name or logs in to his account, a very simple interface opens with icons. Everything is in icons, of course, and in a professional manner. He begins by writing his name, email, company name, and the amount that the company withdraws. He also writes the company’s date of birth. After that, the company’s date of birth appears and the money that came out of the company is also spent in all Arab currencies. This also makes the appearance professional and there are many other features.

企业管理财务应用阿拉伯货币2025/6/13

Deciderz 网页应用

科技en
4.0

Create a web app : named : Deciderz, this app helps in making decisions and taking decisions to user, by taking in to consideration : reality factor, logic, reasoning, emotion of user, will and wish of user, expertise of user, current market trends, futuristic monetary and market based benefits, future scenario and more, provide compulsory log in and registration for users, backend admin panel for us - in which the user log in data, question asked for decision data, which has to be used for marketing, also on the web page on both the side of web page ; provide columns for google ads, make an attractive and simple web page based on current mostly liked colors. also the details of decision logic, reasoning , home web page must include typing bar in centre, and login and registration must be at side, the web app would be connected to openai api for data and decision making logic and reasoning, this web app takes right decision for user from the input the user provides and from the openai inteligence kindly provide space in between typing space and google ads, make it fully functional

决策工具网页开发AI集成2025/4/4

Deciderz决策助手

科技en
4.0

Create a web app : named : Deciderz, this app helps in making decisions and taking decisions to user, by taking in to consideration : reality factor, logic, reasoning, emotion of user, will and wish of user, expertise of user, current market trends, futuristic monetary and market based benefits, future scenario and more, provide compulsory log in and registration for users, backend admin panel for us - in which the user log in data, question asked for decision data, which has to be used for marketing, also on the web page on both the side of web page ; provide columns for google ads, make an attractive and simple web page based on current mostly liked colors. also the details of decision logic, reasoning , home web page must include typing bar in centre, and login and registration must be at side, the web app would be connected to openai api for data and decision making logic and reasoning, this web app takes right decision for user from the input the user provides and from the openai inteligence

决策应用AI决策用户体验2025/4/4

Deciderz 决策应用

科技en
4.0

Create a web app : named : Deciderz, this app helps in making decisions and taking decisions to user, by taking in to consideration : reality factor, logic, reasoning, emotion of user, will and wish of user, expertise of user, current market trends, futuristic monetary and market based benefits, future scenario and more, provide compulsory log in and registration for users, backend admin panel for us - in which the user log in data, question asked for decision data, which has to be used for marketing, also on the web page on both the side of web page ; provide columns for google ads, make an attractive and simple web page based on current mostly liked colors. also the details of decision logic, reasoning and required data would be provided from Open AI , of which api key can be input in it, Api Key : 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. home web page must include typing bar in centre, and login and registration must be at side

决策工具Web应用OpenAI2025/4/4

Kerbv AI 模拟分析

科技en
4.0

https://websim.ai/p/kerbv_la0wfxep4_rx5x/23

AI模拟Kerbv数据分析2025/4/4