HTML & CSS
3232-
4506 USD Yurba — a Ukrainian social network with an anonymous footprint
HTML & CSS
Yurba — a Ukrainian social network focused on free communication and the ability to leave an anonymous trace. The project was created in response to the overloaded and inconvenient functionality of Facebook and the lack of anonymity. The main idea is to provide Ukrainians with their own platform for discussing news, problems, and life in their own information space, using tools developed by Ukrainians for Ukrainians.
Yurba also actively uses AI features:
- analysis of posts and content for advertisers,
… - improvement of recommendations,
- assistance to users (for example, "short excerpt from a post" for premium users).
My Role
I am a co-founder of the project and responsible for:
- UI/UX design of the entire platform,
- frontend development (HTML, CSS, JavaScript, custom component library),
- desktop application on Electron (WebView + additional AI features and integrations).
- I effectively lead the product from idea and prototypes to the implementation of the interface and behavior in the browser/desktop.
Technologies:
Frontend: Vanilla JavaScript, HTML, CSS, custom component library YurbaLib
Backend: Go (Golang), MySQL
Desktop: Electron (wrapper with additional functionality, including AI features)
Infrastructure: WebSocket messaging (real-time for messages and part of interactions)
Main functionality of the project:
- Feed of posts with text formatting options and file attachments.
- User profiles.
- Comments, likes, reposts.
- Three design themes: light, dark, and dark blue.
- Real-time messaging via WebSocket.
- Built-in messenger.
- Feed and profile settings.
- Yurba Coins system — internal currency for gifts and profile decorations.
AI features:
- post analysis,
- recommendations,
- short excerpts/summaries for premium users.
UI/UX and Design System
The interface is built on a familiar structure for users, combining the best ideas from Twitter, Facebook, and other social networks, but in a cleaner and more logical form. The main screen consists of three columns:
1. Left column — navigation menu: messages, news, profile, and key sections.
2. Central column — content: post publication form with formatting settings and file attachments, main feed of posts.
3. Right column — feed settings: additional filters, display settings, etc.
The interface is concise and maximally clean — it is difficult for the user to get confused even on their first visit.
What I can offer you based on this project:
- Development of clear and "live" interfaces for any tasks and products.
- Ability to select effective colors, understanding their impact on product perception.
- Structural approach: both code and design are broken down into separate blocks/components, which can then be easily scaled and customized.
- Full cycle: from idea and prototype in Figma to a ready web or desktop application (VS Code, Git, DevTools, etc.).
-
Adaptive layout of the landing page "Holiday Resort"
HTML & CSS
Website layout according to the design: convenient navigation, responsiveness, semantic structure, and basic accessibility.
-
Website layout
HTML & CSS
Website layout for a company that repairs houses.
#landing #landingpage #webdesign #website layout #houserepair #repair #constructioncompany #website creation #html #css #uiux #responsive design #corporate website #single page website #landingpage #webdesign #webdevelopment #houserepair #constructioncompany #homerenovation #html #css #uiuxdesign #responsive #corporatewebsite #frontend #singlepagewebsite #WordPress
-
901 USD E-zoo
HTML & CSS
webpack scss pug
-
225 USD Adaptive layout of a hosting provider's website
HTML & CSS
Adaptive layout and integration of the layout for the hosting provider website ForceVPS
-
225 USD Adaptive layout of the landing page on React
HTML & CSS
Used react+next.js
-
360 USD Adaptive layout of the pastry workshop
HTML & CSS
Clean adaptive layout of a pastry workshop
-
Wonderland Bakehous
HTML & CSS
Adaptive layout of the pastry shop website
Used html+css+js
-
Lite Blog WEB Layout + Responsiveness
HTML & CSS
Fully ready landing page for a small blog about countries.
Also adapted for all devices including 4K monitors.
-
180 USD Millclock-style Nixie Configurator — HTML5/CSS3 + JS
HTML & CSS
Nixie Clock Configurator — web page for configuring a nixie clock in Millclock style with live lamp preview.
Task
• Convey a branded dark style, make the page responsive, with live preview and instant application of settings.
… • Support for seconds, 12/24 format, various separator modes, brightness, backlighting, Wi-Fi, and NTP synchronization.
• Localization EN/DE.
Stack
HTML5, CSS3 (custom props, grid), JavaScript (ES6)
Layout
• Architecture: semantic header/main/section/footer, modular section cards.
• Styles: CSS variables in :root (colors, radii, shadows, glow), custom toggles and selects in iOS style.
• JS logic: reactive preview updates (time formats, separator, brightness, color), soft blinking of the separator (~1 s).
• Responsive: clamp typography, grids, fluid sizes of lamps and separators while maintaining proportions.
Functionality Scope
• Time & Date: time format, time zone, DST (US/EU/OFF), date, Set Time.
• Display & Lighting: brightness, LED color (RGB), glow/animation mode, night mode, auto-dimming.
• Connectivity: SSID/Password, NTP, connection test.
• Sound & Alarms: hourly chime, alarms, volume.
• Modes & Safety: slot machine, temperature units, temperature display.
• System: device name, updates, firmware, reset.
• Separator: blinking/static/off; separate "small" nixie separator with options ":" and "."
• Special characters: °C and °F in nixie style.
#Nixie #UI #UX #WebDesign #Frontend #HTML5 #CSS3 #JavaScript #SVG #Canvas #Animation #Responsive #DarkTheme #IoT #Clock #Millclock #Accessibility #Localization
-
90 USD Form that generates images using AI
HTML & CSS
You can choose:
- AI model
- Number of pictures
- Size of pictures
…
And you can also change the color theme
-
113 USD idStudio
HTML & CSS
idStudio — website of a creative digital agency (Frontend)
Developed a responsive website for a design and development studio. The design is built around minimalism, a clear structure, and effective visual presentation.
What has been implemented:
…
Responsive design for mobile, tablets, and desktops;
Navigation with smooth scrolling;
Webpack build with SCSS.
Technologies:
HTML5, SCSS, JavaScript (ES6), Webpack
#Frontend #HTML #SCSS #JavaScript #Webpack #ResponsiveDesign #FrontendDevelopment
-
96AI & Machine Learning
-
5AR & VR Development
-
235Bot Development
-
63C & C++
-
84C#
-
265Content Management Systems
-
95Cryptocurrency & Blockchain
-
177Data Parsing
-
70Databases & SQL
-
121Desktop Apps
-
44Embedded Systems & Microcontrollers
-
154Gaming Apps
-
3232HTML & CSS
-
27Java
-
293Javascript and Typescript
-
485PHP
-
224Python
-
82Testing & QA
-
2452Web Programming
-
34793D Modeling
-
361AI Art
-
2280Artwork
-
7246Banners
-
2051Business Card Design
-
55Clothing design
-
2015Corporate Style
-
210Exhibition Booth Design
-
575Icons & Pixel Graphics
-
11672Illustrations & Drawings
-
399Industrial Design
-
642Infographics
-
963Interface Design (UI/UX)
-
6056Interior Design
-
13692Logo Design
-
886Mobile Apps Design
-
1536Outdoor Advertising
-
4144Packaging and label design
-
1005Presentations
-
9173Print Design
-
2088Social Media Page Design
-
43Type & Font Design
-
4046Vector Graphics
-
6VR & AR Design
-
10513Web Design
-
10AI Consulting
-
1224Content Management
-
38Customer Support
-
20Cybersecurity & Data Protection
-
56Data Processing
-
73Enterprise Resource Planning (ERP)
-
101Information Gathering
-
666Online Stores & E-commerce
-
10Payment Systems Integration
-
93Tuition
-
5000Website Development
-
168Website Maintenance
-
12App Store Optimization (ASO)
-
978Contextual Advertising
-
250Email Marketing
-
220Lead Generation & Sales
-
38Link Building
-
52Marketing Research
-
1Public Relations (PR)
-
1192Search Engine Optimization (SEO)
-
34Search Engine Reputation Management (SERM)
-
651Social Media Advertising
-
838Social Media Marketing (SMM)
-
6Teaser Advertisements
-
343Website SEO Audit
