This application is a 3D business card viewer that allows users to upload images for the front and back of a business card, which are then rendered in a 3D environment. The app provides an interactive experience where users can rotate and view the card from different angles. To use the app, users can drag and drop images onto the designated area or click to browse their files. The app supports various aspect ratios for the card, which can be selected through a dropdown menu. Users can also enable an auto-fit feature that adjusts the card dimensions based on the uploaded images. Once the images are uploaded, they are displayed on a 3D model of the card, which can be manipulated using mouse controls. The application is built using React and TypeScript, leveraging libraries such as Three.js for 3D rendering and Lucide for icons. The user interface is styled with Tailwind CSS, providing a modern and responsive design. The app also includes features like loading spinners, error handling for image uploads, and fallback textures in case the images fail to load. Key features of the app include: - Image upload via drag-and-drop or file selection. - Aspect ratio selection for the card. - Auto-fit functionality to adjust card dimensions. - Interactive 3D rendering of the business card. - Error handling for image loading failures. - Responsive design suitable for various screen sizes. Overall, this app provides a user-friendly interface for creating and viewing custom 3D business cards, making it a useful tool for professionals looking to showcase their contact information in a visually appealing format.
No tags
Last Updated April 25, 2025
