Crypto Pulse
Przedstawiam koncepcję strony głównej dla platformy analitycznej Crypto Pulse. Kluczowym zadaniem było zapakowanie skomplikowanego zbioru danych w estetyczny i intuicyjny interfejs, który równie dobrze nadaje się zarówno dla doświadczonych traderów, jak i nowicjuszy.
W centrum uwagi znajduje się blok z „żywymi” notowaniami i szybkimi działaniami. Specjalnie wyodrębniłem główne wskaźniki rynkowe — kapitalizację, dominację BTC i wolumen obrotu — w górnej części ekranu, aby użytkownik mógł natychmiast ocenić stan rynku, nie przewijając strony. Szczególną uwagę zwrócono na UX-hak: propozycję konta demo na 10 000 USD, co obniża próg wejścia i motywuje do rejestracji.
Język wizualny projektu oparty jest na estetyce „technologicznej nocy”. Głęboki ciemny tło w połączeniu z neonowym blaskiem i miękkimi gradientami tworzy atmosferę futurystyczności i niezawodności. Użycie półprzezroczystych szklanych kart (Glassmorphism) na tle siatki nadaje interfejsowi głębię i pomaga wyraźnie rozgraniczyć różne typy danych. W rezultacie powstał nowoczesny, dynamiczny design, który przekazuje szybkość i technologiczność, pomagając użytkownikowi skupić się na podejmowaniu decyzji w warunkach szybko zmieniającego się rynku.
Stos technologiczny projektu
Frontend i architektura:
—React 19 + TypeScript
—Vite
—Tailwind CSS v4
—React Router
—Recharts
Dane i „backend” w przeglądarce:
—Binance WebSocket
—CoinGecko API
—localStorage
W centrum uwagi znajduje się blok z „żywymi” notowaniami i szybkimi działaniami. Specjalnie wyodrębniłem główne wskaźniki rynkowe — kapitalizację, dominację BTC i wolumen obrotu — w górnej części ekranu, aby użytkownik mógł natychmiast ocenić stan rynku, nie przewijając strony. Szczególną uwagę zwrócono na UX-hak: propozycję konta demo na 10 000 USD, co obniża próg wejścia i motywuje do rejestracji.
Język wizualny projektu oparty jest na estetyce „technologicznej nocy”. Głęboki ciemny tło w połączeniu z neonowym blaskiem i miękkimi gradientami tworzy atmosferę futurystyczności i niezawodności. Użycie półprzezroczystych szklanych kart (Glassmorphism) na tle siatki nadaje interfejsowi głębię i pomaga wyraźnie rozgraniczyć różne typy danych. W rezultacie powstał nowoczesny, dynamiczny design, który przekazuje szybkość i technologiczność, pomagając użytkownikowi skupić się na podejmowaniu decyzji w warunkach szybko zmieniającego się rynku.
Stos technologiczny projektu
Frontend i architektura:
—React 19 + TypeScript
—Vite
—Tailwind CSS v4
—React Router
—Recharts
Dane i „backend” w przeglądarce:
—Binance WebSocket
—CoinGecko API
—localStorage