Messenger UI

Messenger-ui

SMS -Messaging -Anwendung für Desktop- und Mobilgeräte

Aufgabe

Erstellen Sie eine Replik -Anwendung für Textnachrichten, die beides ... für die Augen angenehm ist, und geben Sie dem Endbenutzer die beste Erfahrung. Bringen Sie Ihre UI/UX -Designfähigkeiten heraus, die den Benutzern die beste Erfahrung bieten, während Sie Ihre Anwendung nutzen! Entwerfen Sie eine App, die nicht nur mobilfreundlich ist, sondern auch auf verschiedenen Geräten wie einem Laptop oder einem Desktop verwendet werden kann.

Kriterien

• Auswahl des Designs, Layouts und Intuitivität der Schnittstelle.
• Reaktionsfähigkeit über verschiedene Geräte hinweg
• Erstellen Sie Markup, das kompatibel ist und mit der aktuellen Version des Browsers auf dem neuesten Stand ist
• Erstellen Sie mindestens 1 oder mehr CSS -Stilblatt (Sie können alle Framework Ihrer Auswahl verwenden, müssen auch alle Framework und Codes enthalten ).
• Erstellen Sie mindestens 1 oder mehr JavaScript -Dateien, die mit DOM interagieren.
• Erstellen Sie einen Backend-Server, um Ihre Codes zu hosten (optional, aber Sie können sich dafür einige "Brownie-Punkte" verdienen :-)

Zusammenfassung von Tech Stack

Diese Anwendung wurde mit den neuesten Technologien- und Designmustern der heutigen Ära (2020) erstellt. Ich entschied mich für die Erstellung dieser Anwendung mit reinem HTML, CSS und JavaScript. Mit HTML, CSS und JavaScript kann ich meinen Code schnell und einfach strukturieren und Layouts ein reibungsloses, elegantes Reaktionsdesign geben.

Für CSS habe ich mich wegen seiner erstaunlichen Eigenschaften entschlossen, mit SASS (syntaktisch großartige Stilblätter) zu gehen. Mit SASS kann ich Stile schneller auf meine Layouts anwenden als normale CSS. Dieses Framework bietet auch Funktionen wie Nisting, sodass ich Elemente leichter manipulieren kann als das Standard -CSS. Dies führt zu einer besseren Struktur und minimiert die Zeit, um die Aufgabe zu erledigen. Mit einer Team -Denkweise wird dies für jeden zukünftigen Entwickler großartig sein, der möglicherweise an diesem Projekt teilnimmt.

Mobiles Design

Desktop -Design