Memory Game ala Super Mario mit JavaScript // Tutorial

Memory Game ala Super Mario mit JavaScript // Tutorial

In dem Tutorial „How to Create a Memory Game (ala Super Mario 3) with Plain JavaScript“ erklärt Tania Rascia wie man ein einfaches Memory Spiel mit JavaScript und Basis-Wissen von HTML und CSS realisiert. Hier die fertige Demo. Kann man mit individuellen Grafiken sicherlich auch auf der eigenen Website als Schmankerl einbinden.  

H1 // kostenloses Mobile UI Kit für Sketch & Photoshop

H1 ist ein kostenloses, farbenfrohes Mobile UI Kit für Sketch & Photoshop von Hristo Hristov. Hier geht’s direkt zum Pay what you want Download: gumroad.com/l/lyEF A beautiful Mobile UI Kit. 10 Categories. 130 Templates. 470+ UI Elements. For Sketch & Photoshop.

Yo! Weekly by Rob Hope // Design News Webcast Serie

Der neue Yo! Weekly Webcast von Rob Hope bringt jede Woche in komprimierter Form Video-News rund um Design, Webdevelopment, Freebies und einer Auswahl der besten Websites als Inspiration. Alle vorgestellten Links finden sich dabei unter dem jeweiligen Video oder direkt über den Yo! mailer Newsletter. Feine Sache für alle, die im Kreativ- oder Tech-Bereich arbeiten. Teil 2 ist inzwischen auch online: Credits:  Personal Website: https://robhope.com Newsletter: https://robhope.com/yo Twitter: https://twitter.com/robhope Instagram: https://instagram.com/hitdelete Facebook: https://facebook.com/robhope One Page Love: https://onepagelove.com

Design Systems Handbook

Wahnsinn, was Invision hier mit Hilfe von Marco Suarez, Jina Anne, Katie Sylor-Miller, Diana Mounter, und Roy Stanfield zusammengetragen hat. Das „Design Systems Handbook“ beschreibt und veranschaulicht im Detail wirklich alles was man zum Thema Design Systeme / Style Guides / Frontend Boilerplates wissen muss. Die Kapitel sind dabei unterteilt in folgende Themen: Introducing Design Systems, Designing your design system, Building your design system, Putting your design system into practice, Expanding your design system und The future of design systems. Neben detaillierten Beschreibungen und Beispielen, gibt es außerdem noch zahlreiche Podcasts, Videos und weiterführende Links zum Thema. A design system unites product teams around a common visual language. It reduces design debt, accelerates the design process, and builds bridges between teams working in concert to bring products to life. Learn how you can create your design system and help your team improve product quality while reducing design debt.

Gadgets & Technology Icon-Set // 152 kostenlose Icons

Swifticons liefert euch mit ihrem vierten, kostenlosen Iconset 152 Icons rund um Gadgets und Technologie im Outline Style. Kann man sicherlich für das ein oder andere Projekt mal gebrauchen. Das Ganze kommt in den Formaten AI, Sketch, PNG, SVG und EPS. » via Noupe

Mashup Template // kostenlose HTML5 Website Templates

Mit Mashup Template bietet das Orson.io Team zur Zeit 7 komplett kostenlose und anpassbare HTML5 / CSS3 Website Templates an. Neben HTML gibt’s obendrauf bei Bedarf noch eine Sketch oder npm Version. Die minimalistischen und responsiven Vorlagen sollten ideal sein, um vor allem Landing Pages, Microsites oder Portfolios aufzubauen. Mashup template is a collection of 100% free and customizable HTML5/CSS3 templates based on ready-to-use blocks and a light version of the Bootstrap Framework 3.3.7. Mashup Template also provides a full automated development workflow based on Webpack and Handlebars. with live reload to customise your CSS with the SCSS framework. Mashup Template is a side project made by our team at Orson.io, creators of a website builder specialised in SEO.

Landing UI Kit // kostenloses PSD von Mahir Abrar Akash

Landing UI Kit ist ein kostenloses Photoshop File mit über 50 Unterbereichen. Ideal für Landing Pages, Microsites oder Portfolios. Zum Direktdownload geht’s hier: bit.ly/2qZTL1D Mahir Abrar Akash @Behance: behance.net/gallery/53273999/Free-Landing-UI-Kit

Moving Letters // Animated Text with JavaScript and anime.js

Moving Letters ist ein schönes, kleines Side-Projekt von Tobias Ahlin: Animierte Text Effekte via JavaScript und anime.js, die sich vor allem für Headlines in diversen Projekten eignen. Den Sourcecode gibt’s kostenlos unter MIT Lizenz. If you’re into animation, I made a collection of open source text effects animated with JavaScript & anime.js https://t.co/wsMTHwSswx ❤️ pic.twitter.com/rTN3SFddtH — Tobias Ahlin (@tobiasahlin) October 3, 2017

Don’t call it Screenshot // Responsive Blog Launch

Wird mal wieder Zeit ein eigenes Projekt etwas näher vorzustellen. Don’t call it Screenshot ist ein persönlicher Gaming Blog rund um das Thema In-Game / Video Game Photography. Der Blog ist quasi ein – mehr oder weniger – chronologisches Tagebuch meiner Entdeckungen in diversen Spielen. Dabei geht es vor allem darum Settings, Charaktere und Situationen in Spielen einzufangen, die man normalerweise vielleicht verpasst – die Perspektive des Spielers wird dabei zur Kamera. Damit ist das Ganze vielleicht noch am ehesten mit Street Photography vergleichbar. Neben Konzept, Webdesign und Webentwicklung übernahm ich auch diverse SEO- und Performance-Optimierungen in WordPress. Weitere Informationen auch im Portfolio: kolos.de/portfolio/dont-call-it-screenshot-responsive-blog P.S.: Kann Spoiler enthalten ;) P.P.S.: Es gibt auch eine Facebook-Fanpage, die ihr abonnieren könnt: facebook.com/dontcallitscreenshot/

OAK // Kostenloses HTML Portfolio Template

OAK ist ein kostenloses HTML Template von EliteFingers, welches sich vor allem für minimalistische Portfolio Websites eignet. Live-Demo: oak.elitefingers.com/html/ Direktdownload: freebiesbug.com/download/OAK-HTML-Template.zip Premium WordPress Version: themeforest.net/item/oak-creative-multipurpose-portfolio-wordpress-theme/15879027 OAK is built on the top of Bootstrap 3 and comes with 15 pre-made pages a bunch of amazing features: it makes use of modern jQuery and CSS3 techniques to create superb eye-catching animations and make your visitors love you and your work. It is simple, modern and responsive. » via Freebiesbug