Daten weg – was tun?

Diese Frage haben sich bestimmt schon viele gestellt. Ich jüngst im Urlaub, als plötzlich die Bilder von vier Urlaubstagen fehlten. Nicht mehr aufzufinden – weder im Papierkorb noch sonst irgendwo. Panik steigt auf, was mach ich jetzt? Irgendwie konnte ich mich noch an die Aussage eines Freundes erinnern, dass sich Daten nicht in Luft auflösen und noch einige Zeit gerettet werden können (G2K: Der Speicher mit den Daten wird im System nur als „frei“ markiert und dann nach und nach von neuen Daten überschrieben). Also los ging’s mit der Recherche… macht in diesem Bereich leider gar keinen Spaß. Viele dubiose und angestaubte Anbieter mit zweifelhaften Geschäftsmodellen tummeln sich auf dem Markt.

Die meisten Programme sind ziemlich veraltet: Software, die zuletzt in 2007 ein Update bekommen hat, war keine Seltenheit. Das nächste Problem sind die Preismodelle, denn oft sind die Kosten hinter einer Gratis-Version „versteckt“. Das sieht oft wie folgt aus: Man lädt die kostenlose Version herunter mit der man den Datencheck durchführen kann und freut sich tierisch, weil man seine geliebten verlorenen Daten wieder sicher glaubt. Dann drückt man auf „Wiederherstellen“ und wird auf einen mehrstufigen Bezahl-Prozess weitergeleitet. Klar, man will seine Daten ja unbedingt wiederhaben und unter Umständen handelt es sich ja um kritische Kundendaten etc. Also ist man natürlich bereit einiges zu investieren – was sind da schon 200 Euro, wenn ich danach die Daten wieder habe? Das machen sich viele Anbieter zunutze.

Ich lasse mich jedoch nicht gerne erpressen. Nach erneuter Suche bin ich schlussendlich auf Disk Drill gestoßen, ein seriöser Anbieter mit Käuferschutz durch PayPal. Transparente AGBs und eine ansprechend moderne sowie aktuell gehaltene App runden das Angebot ab. Inhaltlich kann die App alles, was die anderen Anbieter auch konnten – nur in aktuell und hübsch ;). Außerdem bietet Disk Drill einiges an Zusatzfunktionen, wie z.B. nach belegtem Speicher suchen und diesen optimieren oder sicher löschen etc.

Aber zum Wesentlichen:

  • Das Programm hat mich 77 Euro gekostet (nach kurzer Suche konnte ich sogar einen gültigen Gutscheincode finden).
  • Das Durchsuchen meiner Festplatte ging ziemlich fix.
  • Es wurden alle verlorenen Daten gefunden und über 95 Prozent konnten sogar komplett wiederhergestellt werden.
  • Das Wiederherstellen ging ebenfalls vergleichsweise zügig.

 

Fazit: Jederzeit wieder!

Man sollte also auf keinen Fall dem erstbesten Anbieter vertrauen und zu schnell klein beigeben. Das lohnt sich oft und man kommt nicht nur billiger weg dabei weg, sondern meistens auch besser :).

Datenwiederherstellung mit Disk Drill

So sehen übrigens wiederhergestellte Bilder aus, bei denen man einen Tick zu spät dran war.

Zu spät wiederhergstellte Bilder

Wiederhergestellte Bilder und Daten

Hier noch der Link zum Anbieter

App-Programmierung für iOS und Android mit ReactNative

Einmal JavaScript-Code schreiben und Apps mit nativen Elementen für iOS und Android erhalten. Mit Facebook’s ReactNative können Software-Entwickler, die Erfahrungen mit nativer App-Programmierung haben, zügig eine einfache App für die aktuellen Hauptplattformen entwickeln und in den Apple App-Store sowie GooglePlay Store bringen.

Was ist ReactNative?

Mit ReactNative lassen sich iOS- und Android-Apps programmieren, die native Elemente verwenden und sich somit nicht von nativ programmierten Apps unterscheiden. Der Code wird nur einmal geschrieben, das Ergebnis ist eine App für iOS-Geräte und eine App für Android-Geräte.

ReactNative ist somit in keiner Weise mit Cordova oder ähnlichen Javascript-Frameworks vergleichbar, da diese lediglich Websites in einem Container sind. Native iOS- oder Android-Elemente kommen eigentlich nicht vor.

Bei ReactNative ist das anders. Das Framework von Facebook benutzt JavaScript und React, um native Elemente miteinander zu verbinden. Geschrieben wird der Code in JSX, einer Erweiterung basierend auf JavaScript und direkt in JavaScript. Hierbei wird die JavaScript-Syntax nach der ECMAScript-6-Norm verwendet. ReactNative-Apps laufen auf Geräten ab iOS 8 und Android 4.1.

Render-Funktion des Frameworks ReactNative zur App-Programmierung
Render-Funktion ReactNative

Im Beispiel sieht man die Render-Funktion einer klassischen ReactNative-Component. Zurückgegeben wird eine gestylte „View“, die als Subview ein „Text“-Element beinhaltet. Das „Text“-Element enthält einen Text und die Variable „name“, die von außen gesetzt wird.

Wie auch „View“ hat „Text“ die Property „style“. Mit „style“ lassen sich UI-Elemente Gestalten und Positionen. Das Naming ist ähnlich zu CSS. Will man Elemente in Abhängigkeit zu anderen Elementen positionieren, benutzt man flex, flex-direction und Ähnliches.

Benutzt man wie im Beispiel den Tag „Text“, wird im Hintergrund eine UILabel (iOS) bzw. eine TextView (Android) genutzt. Der „View“-Tag wird zu UIView bzw. zu einer nativen (Android-)View. Viele dieser Elemente oder auch Components genannt, liefert ReactNative standardmäßig und können ohne zusätzliche Installationen benutzt werden. Oftmals findet man in der npm-Library Erweiterungen zu bestehenden Components oder auch ganz neue, praktische Components. Möchte man eine native Component in ReactNative, die noch nicht verfügbar ist oder bestehenden nativen Code nutzen, muss man zuerst ein natives Bridging-Modul erstellen. Hierfür wird aber erweitertes Wissen in nativer App-Entwicklung für die jeweilige Plattform vorausgesetzt.

Was sind die Voraussetzungen für die App-Programmierung ReactNative?

Will man „nur“ Apps programmieren und sich nicht um das Drumherum (Veröffentlichung, Testphasen, etc.) kümmern, sollte man ein solides Wissen rund um JavaScript und das grundlegende Verständnis für den Aufbau einer App (ViewController, Daten-Handling, etc.) mitbringen.

Außerdem sollte man wissen, wie man mit dem Terminal umgeht, da ein großer Anteil bei der Einrichtung eines Projekts über die Console getätigt wird.

Gehen die Anforderungen über das Programmieren hinaus, sind vor allem auf iOS-Seite Erfahrungen rund um Zertifikate, Provisioning-Profiles und iTunesConnect erforderlich, da es sonst an der Veröffentlichung der App scheitern wird. Mit Android geht es vergleichsweise einfach, da es hierbei mit einigen Terminal-Eingaben und einem Google-Account oftmals getan ist.

Wann macht ReactNative Sinn?

Eine pauschale Antwort auf diese Frage gibt es nicht.

Beherrscht man zum Beispiel die native App-Programmierung für Android und kennt sich mit iOS weniger aus, macht eine ReactNative-App vielleicht mehr Sinn, als sich Swift oder Objective-C beizubringen. Das selbe gilt natürlich auch andersrum. Ist diese App allerdings so umfangreich, dass man nur wenige Codezeilen gemeinsam verwenden kann und somit viel mit Bridging-Modulen arbeiten muss, ist die native Programmierung empfehlenswerter.

Starten sollte man aber auf jeden Fall mit einer „kleineren“ App, um ein Gespür dafür zu bekommen, wo die Grenzen von ReactNative sind. Je umfangreicher die App, desto mehr Probleme können auftreten. Gerade bei vielen Daten oder beim Thema Sicherheit muss man sich bewusst sein, dass ReactNative  – Stand Frühjahr 2017 – standardmäßig kein komfortables Datenhandling (Datenbank, Zugriff auf der Platte, etc.) und keinen Zugriff auf den iOS-Keychain mitliefert.

Wie starte ich am besten?

Die aktuell wichtigste Seite im Internet zum Thema ReactNative ist https://facebook.github.io/react-native/.

Wer noch keine Erfahrung mit ReactNative gemacht hat, sollte sich zuerst eines der vielen Tutorials im Internet anschauen und sich mit den Components, deren Life-Circle, State-Changes und Imports vertraut machen, bevor man mit dem eigentlichen Projekt beginnt. Es macht auch immer Sinn, kleinere Testprojekte anzulegen, um zum Beispiel ein neues Modul oder eine externe Library zu testen. Verzichten sollte man auch nicht auf ein Versionsverwaltungstool.

Da ReactNative ein relativ junges Framework ist, kann man davon ausgehen, dass noch viel passieren wird. Man sollte sich aber auch bewusst sein, dass hinter dieser Technologie Facebook steht.

_____

Quellen:

https://facebook.github.io/react-native/

http://blog.teamtreehouse.com/introduction-to-react-native

Web- und Screendesigns effizient gestalten mit Sketch

Die Konzeption einer Website oder deren Relaunch geht einher mit der Entwicklung und Erstellung von Screendesigns. Auf Basis dieser Screendesigns leitet der Webentwickler die Templates für die Umsetzung der Website ab. Innerhalb des Responsive Webdesigns können hierzu eine Vielzahl von Screendesigns für die unterschiedlichen Viewports anfallen. Je nach Umfang und Anforderung können diese Screens für Desktop, Tablet und Smartphone sein. Dabei gilt es sowohl den Landscape- sowie Portraitmodus ebenfalls zu berücksichtigen – wobei diese lediglich die Auswertung des Seitenverhältnisses des Browserfensters darstellt und nicht die Abhängigkeit des Devices darstellt.

Responsive Webdesign benötigt viele Screens

Gerade diese Vielzahl an notwendigen Screens sind zeitintensiv zu erstellen und wurden bisher in den zeroseven design studios in Adobe Photoshop realisiert. Um bei Screendesigns, insbesondere für die mobilen Ansichten effizienter und schneller zu werden, waren wir auf der Suche nach einem Tool, um das Webdesign einfacher zu gestalten, ohne dabei Abstriche im Design und der Handhabung machen zu müssen. Adobe Photoshop bietet zahlreiche Werkzeuge sowie Effekte und ist eigentlich in der Bildbearbeitung führend, jedoch für die Anforderungen eines modernen Webdesigns nur bedingt optimal einsetzbar.

Unsere Praktikantin Amelie Chupin kam während ihres Studiums an der Hochschule für Gestaltung Schwäbisch Gmünd mit verschiedenen Tools für das UI Design in Berührung, unter anderem mit Sketch, was den Anlass bot, das Programm als Alternative zu den Adobe Programmen zu testen.

Sketch im Test bei der Erstellung von Screendesigns

Sketch ist ein vektorbasiertes Programm, dass sich auf digitale Medien spezialisiert hat. Es eignet sich daher, ebenfalls pixelbasierte Projekte zu gestalten. Hierfür kann man zwischen Vektor und Pixeldarstellung umschalten.

Sketch ähnelt dem Grundaufbau von Adobe und ist damit sehr intuitiv bedienbar. Alle Grundwerkzeuge, die es in Adobe gibt, sind auch in Sketch enthalten. Die Logik, mit verschiedenen Ebenen zu arbeiten, ist ebenfalls vorhanden. Demzufolge kann man nach einer kurzen Kennenlernphase schnelle und ansprechende Ergebnisse erzielen.Durch viele Voreinstellungen und Templates wird das Suchen nach dem richtigen Format und dem passenden Grid gespart, sodass man direkt in der richtigen Auflösung loslegen kann.

Sketch iOS UI Design Templates
Sketch iOS UI Design Templates

Voreingestellte Artboards (entsprechen den Zeichenflächen in Illustrator) umfassen unter anderem die Größen von Desktop HD, Desktop, Tablet und Mobile und lassen sich beliebig erweitern.

Artboards
Voreingestellte Artboards für die Bildschirmgrößen Desktop HD, Desktop, Tablet und Smartphone

Ein weiterer Vorteil in Sketch ist das Erstellen von Symbolen. Beispielsweise lässt sich so eine Navigation, die auf jedem Screen auftritt, einmal erstellen und beliebig oft auf unterschiedlichen Artboards einfügen. Wird die Navigation im Nachhinein verändert, reicht es, das Symbol zu ändern. Alle Symbole werden dann auf den Artboards aktualisiert. 
Es gibt außerdem schon einige iOS Symbole in Sketch, wie zum Beispiel unterschiedliche Keyboards, Status Bars, Alert Views und vieles mehr, die die Arbeitszeit verringern und es ermöglichen realistische Screens zu erstellen.

Die gängigsten Stile (Transparenz, Schatten, Füllung, Weichzeichner) werden übersichtlich rechts angezeigt, um alle Elemente schnell zu bearbeiten.

Gängigste Stile wie Transparenz, Schatten, Füllung und Weichzeichner

Des Weiteren lassen sich durch die App „Sketch Mirror“ die Artboards direkt auf dem Smartphone anzeigen und testen. Dadurch erübrigt sich, mühsames verschicken von Screens.

Sketch Mirror App

Die Artboards sind ebenfalls über den Browser abrufbar und werden wie in der App live aktualisiert.

Die Exportoptionen ermöglichen es, unterschiedliche Formate, Größen und Qualitäten in einem Arbeitsschritt zu exportieren.


Durch Plugins lässt sich Sketch noch weiter optimieren. Das Craft Plugin von Invision zum Beispiel, umfasst unterschiedliche Tools, die sowohl alleine als auch im Team Vorteile bieten. Zum einen kann man mit Craft verschiedenen Content generieren, seien es Fotos, Namen oder Daten. Sketch lässt sich dabei mit einer Stock Plattform, Dropbox oder lokalen Ordnern verbinden. Auch lässt sich der gesamte Content einer Website in die Gestaltung integrieren.
Durch Sync lassen sich Farbschemen, Textformate und Buttons konzipieren, die dann allen Designs des Teams zur Verfügung stehen.
Ein Nachteil von Sketch ist, dass bei größeren Dateien die Performance leidet und die Software nicht mehr flüssig läuft. Außerdem stellt sich einfaches Maskieren als umständlich dar.

Test-Fazit

Abschließend können wir folgendes Fazit ziehen: Sketch ist bestens für Web- und App-Design geeignet. Übersichtliche Darstellung und einfache Werkzeuge ermöglichen es, schnelle Konzepte und Screendesigns zu erstellen. Plugins erweitern das Tool um einige Funktionen und bilden so im Wesentlichen einen Mehrwert beim Generieren von Content und der Zusammenarbeit im Team. Im Bereich des Webdesigns lässt sich Photoshop vollkommen mit Sketch ersetzen, jedoch wird das Tool die umfassenden Möglichkeiten der Bildbearbeitung von Adobe Photoshop nicht erreichen.

Social Media Automation mit dem TYPO3 CMS

Wie wäre es also, wenn Social Media Engagement automatisch und direkt aus dem TYPO3 Backend zu steuern ist?

Mittlerweile besteht Einigkeit darin, dass Social Media Engagement nicht „mal eben nebenbei“ erledigt werden kann. Viele Unternehmen haben erkannt, dass es nicht ausreicht, einen technikaffinen Mitarbeiter mit der Betreuung von Facebook, Twitter & Co. zu beauftragen und diese dort intuitiv agieren zu lassen. Sie haben erkannt, dass Social Media eine Strategie voraussetzt und es wichtig zu wissen ist, welche Themen, Plattformen für das Unternehmen Relevanz haben und von wem diese diskutiert werden. Dementsprechend haben sich die Social Media Kanäle als Instrumente im Marketing-Mix etabliert, die sowohl fachliche als auch finanzielle Ressourcen benötigen.

Trotz dieser positiven Entwicklung stellt das Social Media Engagement immer noch eine zeitintensive Disziplin dar, welche die Rufe nach Tools zur Unterstützung nicht verstummen lassen.

Der Markt bietet zahlreiche Werkzeuge, jedoch keine um aus einem Contentmanagementsystem wie TYPO3 heraus zu agieren.

Zu schön um wahr zu sein?

Nicht mit unserer TYPO3 Social Media Automation Extension.

Die TYPO3 Extension der zeroseven design studios mit seinen RSS-Feeds ist die Basis für die einfache Social Media Automation.

Mit der Social Media Automation Extension werden relevante Inhalte einfach und bequem, zentral im TYPO3 Backend gepflegt. Im Anschluss hieran können diese Inhalte automatisiert über einen RSS-Feed in Social Media Kanäle wie Facebook, Twitter, XING, Instagram und Pinterest geteilt werden.

Die Steuerung direkt aus TYPO3 heraus bietet einige Vorteile, da der relevante Content bereits im TYPO3 CMS hinterlegt ist und somit doppelte Datenbestände vermieden werden können. Darüber hinaus steht eine Hashtag-Library zur Verfügung, die es ermöglicht häufig verwendete Begriffe zu definieren und eine einheitliche Schreibweise sicherzustellen. Bei Bedarf können diese Hashtags ausgewählt werden.

TYPO3 Social Media Automation Extension im Backend

Mit dieser TYPO3 Social Media Automation Extension gelingt wieder die Fokussierung auf das Wesentliche der Arbeit. Mit wenigen Klicks wird ein einfacher und flexibler Automationsworkflow realisiert, der den Social-Media-Prozess schneller sowie produktiver gestaltet. Dabei werden keine Programmierkenntnisse benötigt.

TYPO3 Social Media Automation Extension im Backend

Publikation

Inhalte können mit TYPO3 Social Media Automation Extension direkt aus dem Backend des TYPO3 CMS terminiert und gestaffelt publiziert werden. Status-Updates lassen sich damit über die Zeit verteilt veröffentlichen, um möglichst viele Empfänger aus der relevanten Zielgruppe anzusprechen.

Distribution

Ein Inhalt – zum Beispiel der Hinweis auf einen neuen Blogbeitrag – lässt sich automatisch auf mehreren Social-Media-Plattformen zeitgleich oder zeitversetzt veröffentlichen.

TYPO3 Social Media Automation Extension im Backend

TYPO3 Social Media Automation Extension im Backend

Social Media Automation für eine Vielzahl an Plattformen

Facebook und Twitter Automation

Über die RSS-Feeds der TYPO3 Social Media Automation Extension und unseren Automationsdienst lassen sich zwei mögliche Varianten der Automation auf Facebook und Twitter realisieren. In der ersten Variante werden Status-Updates mit Text, Bild und Links ermöglicht. Mit der zweiten Variante lassen sich Fotos auf der Facebook Fanpage oder Twitter direkt aus TYPO3 veröffentlichen. Welche Variante gewählt wird, steht frei und es kann zwischen ihnen gewechselt werden.

XING Automation

Durch den speziell für XING optimierten RSS-Feed der Social Media Automation Extension für das TYPO3 CMS können Mitarbeiter, diesen in ihr Profil einbinden. Mit jeder neuen Meldung teilen diese Mitarbeiter neue Nachrichten automatisch in deren XING-Netzwerk und werden damit als glaubwürdiger Markenbotschafter des Unternehmens wahrgenommen und erzielen damit eine hohe Reichweite.

Instagram und Pinterest Automation

Die TYPO3 Extension stellt Fotos mit Beschreibung und Link automatisch auf den Fotoplattformen bereit. Damit wird lediglich auf die Bilder zugegriffen, die in TYPO3 gepflegt bzw. in der Dateiliste hinterlegt sind. Das spart Zeit durch die Vermeidung von zusätzlichen Uploads auf den jeweiligen Plattformen.

Haben wir Ihr Interesse geweckt?

Perfekt! Gerne stellen wir Ihnen in einem persönlichen Termin die Extension unverbindlich und kostenlos vor.
Am besten kontaktieren Sie uns noch heute – wir freuen uns auf Sie!

Update LeadHound Visitenkartenscanner auf Version 2.2

LeadHound Visitenkartenscanner erkennt Leads noch schneller

Mit LeadHound geht die Lead-Erfassung schneller. Soweit, so gut. Mit der Version 2.2 wurde die QR-Code-Erkennung in Echtzeit integriert. Noch während Sie die Kamera des iPads ausrichten, erkennt und analysiert die Visitenkartenscanner-Software die Visitenkarte. Befindet sich ein QR-Code aufgedruckt, wird der Nutzer darauf hingewiesen und gefragt, ob der Inhalt des QR-Codes weiterverwendet werden soll.

 QR-Code-Erkennung in Echtzeit mit dem LeadHound Visitenkartenscanner

Editierung wird überflüssig

Wurde der QR-Code verwendet, ist die nachträgliche Leadbearbeitung überflüssig. Die gesparte Zeit können Sie  dazu nutzen, weitere Kontakte zu knüpfen.

IMG_0211

Leads exportieren

Eine weitere Neuerung in Version 2.2 ist der Lead-Export. Zukünftig können Leads im Format *.xlsx exportiert werden. Nicht nur, dass der Export somit einschränkungsfrei mir Excel kompatibel ist, er kann auch per Mail an eine Wunsch-E-Mailadresse gesendet werden. Wem das noch nicht reicht, hat in der neuen Version die Möglichkeit, den Export in einem Cloud-Dienst seiner Wahl zu speichern. Notwendig ist für die Export-Teilen-Funktion nur ein Account bei iCloud, Dropox und Co. Die Cloud-Dienste können übrigens auch seit Version 2.1 beim Fragebogenimport genutzt werden.

IMG_0215

Alle Neuerungen in Version 2.2

– QR-Codes werden live erkannt
– Verbesserung der Lead-Bearbeitung (Löschen per Drag and Drop)
– Automatisches Ausfüllen der Anrede
– Erweiterung der Exportformate (Excel-Support)
– Exports können via Mail sowie an alle gängigen Cloud-Dienste gesendet werden
– Verbesserung der Texterkennung und Zuordnung
– Verbesserungen in der Stabilität und Performance

 

Download und weitere Informationen

Besuchen Sie www.leadhound.de

LeadHound Visitenkartenscanner spart Speicherplatz

Das Update unseres Visitenkartenscanners auf  Version 2.1.1 scheint zwar unscheinbar, hat es aber in sich.

mehr als 50% Speicherplatz sparen

Mit ca. 55 MB Speicherplatz auf der iPad-Festplatte und einer Download-Größe von ungefähr 27 MB wird LeadHound über 50% kleiner als noch in Version 2.1. Zu der Einsparung kam es durch eine Optimierung in unserem OCR-Framework. In Zukunft wir der LeadHound-Download also noch schneller gehen mit gleichzeitiger Speicherplatz-Schonung der Festplatte.

„Eine gute App zeichnet sich durch ihre Kompaktheit und Übersichtlichkeit aus – nicht nur im Design und der Nutzerführung.“
– unbekannter Autor –

Mehr Infos zu LeadHound unter www.leadhound.de.
Direkt zum AppStore geht es über diesen Link: LeadHound herunterladen.

 

größe neu
Auschnitt Tabelle iOS-Geräte mit Download- und Installationsgrößen für LeadHound Version 2.1.1

größe alt

Auschnitt Tabelle iOS-Geräte mit  Download- und Installationsgrößen für LeadHound Version 2.1

Wie funktioniert das Drag’n’Drop-Feature in LeadHound?

Das Drag’n’Drop-Feature in LeadHound soll Nutzern bei der Bearbeitung von Leads helfen. Mit Hilfe von Drag’n’Drop können einzelne Wörter eine Property innerhalb ihrer Property umsortiert werden. Außerdem können Wörter auch in eine andere Property verschoben werden. Die neue Position des Wortes wird dem Nutzer angezeigt.

Wer macht was beim Drag’n’Drop?

Für das Drag’n’Drop- Feature werden Custom-Klassen verwendet, deren Aufgaben im Folgenden beschrieben werden:

Z7DragAndDropTableView:UITableView
Z7DragAndDropRow:UIView
Z7DragAndDropTouchElement:NSObject
Z7DragAndDropTouchView:UIView

dragAndDrop

Z7DragAndDropTableView

//public properties
var wasDragging = false
var dragAndDropRows:[Z7DragAndDropRow] = []
var selectedDragAndDropView:Z7DragAndDropTouchView?
var motherRow:Z7DragAndDropRow?
var touchingRow:Z7DragAndDropRow?

Die TableView ist das DragAndDrop-Hirn. Sie kennt alle DragAndDropRows und weiß, welche TouchView gerade bewegt wird.

Sie weiß außerdem, welches die AusgangsRow ist (motherRow) und über welcher Row sich die TouchView gerade befindet (selectedDragAndDropRow).

Bei ihr kommen alle Touches an, die dann verwaltet werden. Die TableView markiert und bewegt die selektierte TouchView. Außerdem deaktiviert sie bei aktivem Dragging das Scrollen der ScrollView.

Sie aktualisiert regelmäßig alle notwendigen Variablen und verwaltet/bearbeitet auch das Verschieben einer TouchView in einen ungültigen Bereich.

Die Unterscheidung, ob eine TouchView nur angeklickt oder ob sie bewegt wurde, wird in der

touchesMoved(touches: Set, withEvent event: UIEvent?)

geprüft und in der delegate-Funktion der TableView

(-(NSIndexPath *)tableView:(UITableView *)tableView willSelectRowAtIndexPath:(NSIndexPath *)indexPath)

über

wasDragging

weiterverarbeitet. Hier wird entschieden, ob der Touch an

-(void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath {

weitergegeben wird.

Implementierung der Z7DragAndDropTableView

Die DragAndDropTableView funktioniert aktuell nur in Verbindung mit einem TableViewController. Die TableView wird per Storyboard mit dem TVC verbunden und ein Outlet wird erstellt.

In der

-(void)viewWillAppear:(BOOL)animated

des TVC wird zuerst reloadData auf dem tableView-Outlet aufgerufen. Anschließend wird die öffentliche Funktion

updateDragAndDropRows()

auf der Z7DragAndDropTableView ausgeführt.

Diese Funktion holt sich aus allen visibleCells alle Zellen, die DragAndDropRows enthalten und speichert diese in der Property

dragAndDropRows

Z7DragAndDropRow

//public properties
var property:BusinessCardProperty?
var textField:UITextField?
var currentPropertyName = ""
var newPositionView:UIView?

Für die DragAndDropRow gibt es zwei Phasen: Init-Phase und Dragging-Phase.

 

Init-Phase

Die DragAndDropRow ist eine Subview der TableView-Zelle.

dragAndDropRow = [[Z7DragAndDropRow alloc] initWithFrame:CGRectMake(0, 0, 0, 0)];
[cellView addSubview:dragAndDropRow];

Sobald der Zelle Text zugewiesen wird, wird die DragAndDropRow gefüllt. Außerdem werden delegate, das textField und der currentPropertyName gesetzt.

Auf Basis des Texts werden in der DragAndDropRow mit Hilfe der TouchElemente die TouchViews generiert und angeordnet.

Ändert sich der Text wiederholt sich dieser Prozess.

 

Dragging-Phase

Während der Dragging-Phase gibt es drei Fälle, die per HitTest unterschieden werden:
„Abmelden“, „Anmelden“ und „Verschieben innerhalb einer DragAndDropRow“

 

– Fall A: Abmelden

Beim Abmelden wird die TouchView aus dem Array „touchViews“ entfernt und der propertyText angepasst. Unterscheidet sich der propertyText, wird per delegate der Text in CoreData gespeichert.

Die restlichen TouchViews der DragAndDropRow werden neu ausgerichtet.

Anschließend wird über das TouchElement der selektierten TouchView

oldProperty

gesetzt und

currentProperty

entfernt.

 

– Fall B: Anmelden

Hat sich eine TouchView bei einer DragAndDropRow abgemeldet, muss sie sich sofort danach bei einer anderen DragAndDropRow anmelden. Dazu wird zuerst per delegate validiert, ob die neue DragAndDropRow nicht vom Property-Typ „gender“ oder eine „AddNewProperty“-Zelle ist.

Damit die neue TouchView weiß, an welcher Position sie sich in der neuen DragAndDropRow einfügen muss, wird über den x-Wert die nächste TouchView gesucht. Die TouchView wird eingefügt und der Text der neuen DragAndDropRow geändert und gespeichert.

Befinden sich rechts neben der selektierten TouchView noch andere TouchViews, werden diese nach rechts geschoben. Die neue Position wird markiert (newPositionView).

Die Property

currentProperty

des touchElements wird entsprechend gesetzt.

 

– Fall C: Verschieben innerhalb einer DragAndDropRow

Wird eine TouchView nur innerhalb einer Row verschoben, wird per hitTest überprüft wie sich die TouchViews der DragAndDropRow verhalten/ausrichten sollen.

Die neue Position wird mit der newPositionView angezeigt. Ändern sich die Positionen, wird das Array der TouchViews angepasst und der Text aktualisiert, was immer wieder eine Speicherung der Property in CoreData mit sich bringt.

Nachdem die selektierte TouchView losgelassen wird, geht sie an ihre entsprechende Stelle in der DragAndDropRow.

Z7DragAndDropTouchElement

// public properties
var text:String?
var currentProperty:String?
var oldProperty:String?

Ein TouchElement wird beim Anlegen der DragAndDropRow generiert und mit einem Wort und dem currentPropertyName der DragAndDropRow initialisiert.

Das TouchElement ist immer als Property einer TouchView gesetzt. Ändert sich die DragAndDropRow der TouchView, werden die currentProperty und die oldProperty aktualisiert.

Z7DragAndDropTouchView

// public properties
var title:String?
var touchElement:Z7DragAndDropTouchElement?
var label:UILabel?

Die TouchView wird per DragAndDrop verschoben. Initialisiert wird sie durch das TouchElement.

init(text:String?, currentProperty:String?) {
    super.init()
    self.text = text
    self.currentProperty = currentProperty
}

Beim Wechsel in eine andere Row ändern sich die Properties des TouchElements.

 

Update von LeadHound auf Version 2.1

Nach nur sieben Wochen im AppStore kommt heute das erste größere Update für LeadHound.

Ab sofort analysiert LeadHound auch QR-Codes auf Visitenkarten und ordnet die verschiedenen Komponenten zu. Voraussetzung ist, dass sich hinter dem QR-Code eine vCard der Version 2.1, 3.0 oder 4.0 verbirgt. Neben QR-Codes können in Zukunft übrigens auch rotierte Visitenkarten analysiert werden.

visitenkartenscanner qr-code

Außerdem unterstützen wir nun den Import von Fragebögen aus neuen Quellen, wie zum Beispiel DropBox oder iCloud.

Wer sich beim Schreiben von E-Mails an erfasste Leads bis jetzt geärgert hat, weil man Texte immer wieder neue verfassen musste, wird sich auch freuen: Mit LeadHound 2.1 kann man jetzt E-Mail-Texte einmal anlegen und immer wieder versenden. Natürlich mit persönlicher Anrede. Mail-Anhänge können selbstverständlich auch vordefiniert werden.

mail_versand

 

Für Feature-Vorschläge in neuen Versionen sind wir übrigens offen. Einfach mal eine Mail an dialog@zeroseven.de mit euren Erfahrungen und warum euer neues Feature praktisch und vorteilhaft ist, senden.

Falls jemand wissen möchte, wie das Drag And Drop in LeadHound funktioniert, kann einfach gleich weiter zu diesem Beitrag – ist aber eventuell etwas technisch.

Für alle anderen hier noch die Übersicht aller neuen Funktionen in LeadHound 2.1:

• Verbesserung der Texterkennung und Zuordnung
• Erkennung von QR-Codes mit vCard (Version 2.1, 3.0, 4.0)
• Erkennung von rotierten Visitenkarten
• Fragebögen können über neue Quellen importiert werden (z.B. iCloud, Dropbox, etc.)
• Email-Texte und Anhänge können vordefiniert werden
• Layout-Anpassungen in den Settings und der ScanView
• Verbesserungen in der Stabilität und Performance

Auslandssemester 2.0: Zwischenruf aus Mexiko Episode VI

Hola Alemania, adios México!

Nun ist es also so weit: Nach vier Monaten geht das Abenteuer Auslandssemester Mexiko zu Ende. Mit einem lachenden und einem weinenden Auge blicke ich auf diese Zeit zurück.
Vor einigen Wochen begann mein Erster Zwischenruf hier aus Mexiko mit den Worten „Hola México, adios Alemania!“, so muss ich das Ganze nun umdrehen und es heißt „Hallo Deutschland, tschüss Mexiko“ – auf jeden Fall fürs Erste.

Wochen voller neuer Eindrücke, Lebenserfahrungen und Begegnungen neigen sich dem Ende zu. Aus meiner persönlichen Erfahrung heraus kann ich nur jedem von euch raten, die Chance wahrzunehmen, für eine Zeit ins Ausland zu gehen – sei es für ein Semester wie bei mir, vielleicht zum Arbeiten oder einfach nur für einen etwas längeren Urlaub. Neben dem, was ich an der Universität Neues dazu gelernt habe, so bin ich nach meiner Rückkehr nun auch reicher an Begegnungen mit unglaublich netten Menschen, unfassbaren Natureindrücken und auch einfach glücklich über die Tatsache eine neue Kultur kennenlernen zu konnten.

Puerto Vallarta in Mexiko

Strand in Puerto Vallarta, Mexiko

Guanajuato in Mexiko

Als ich das erste Mal darüber nachgedacht hatte, nach Mexiko zu gehen, hatte ich die typischen Bilder aus den Urlaubskatalogen im Kopf: Sonne, weiße Sandstrände, glasklares Meer, … was man eben so von Cancún kennt. Leider habe ich es auch dieses Mal wieder nicht dorthin geschafft, aber wenn es dort nur halb so schön ist, wie im Rest Mexikos, dann muss ich da wohl doch noch mal hinschauen.

Mexiko ist wirklich ein tolles Land und was mich immer wieder daran fasziniert, sind die Menschen. Die unglaubliche Offenheit, Warmherzigkeit und Freundlichkeit, mit denen sie einem begegnen sucht seinesgleichen. Da können wir uns manchmal noch ein Beispiel daran nehmen.

San Miguel de Allende

Ich hoffe, mit meinen Zwischenrufen konnte ich euch ein wenig teilhaben lassen an meinen Erlebnissen hier in Mexiko und freue mich, wenn ich die Lust auf einen Auslandsaufenthalt in euch wecken konnte. Wer weiß, vielleicht sehen wir uns in irgendeinem fremden Land auf der Welt wieder.

Für mich geht es jetzt zurück zu meinen Kolleginnen und Kollegen bei den zeroseven design studios für das 6. Semester meines dualen Studiums BWL – Dienstleistungsmarketing. Sollten wir uns nicht an irgendeinem fremden Ort auf der Welt wiedersehen, dann ja vielleicht in der Zionskirche in Ulm.

Bis dahin wünsche ich euch nur das Beste,
Franzi

Responsive und Retina-optimieriert Bilder in TYPO3

Bilder und responsive Webdesign sind nur schwer zu vereinen.
Während das Frontend in relativen Prozent-Angaben und Breakpoints arbeitet, bleiben Bilder zwangsläufig in Form von einzelnen Pixeln erhalten.

Die <picture>-Tag-Lösung hat unter Webentwicklern zwischenzeitlich eine hohe Beliebtheit gefunden und wird von vielen Browsers bereits nativ unterstützt.
Ältere Browser können über Polyfills versorgt werden.

Während aus technischer Sicht die Lösung steht, fängt für den Redakteur der Website das Problem gerade einmal an.

Anforderungen:

Ein Bild-Set für hochauflösende und Pagespeed-optimierte Darstellung von Grafiken verlangt unter Umständen folgendes:

  • Ein Bild pro Viewport für „normale“ Displays.
  • Ein Bild pro Viewport für Retina-Displays.
  • Eine Fallback-Grafik für ältere Browser.
  • Eventuell eine vergrößerte Grafik für die Lightbox-Funktion.

Für den Redakteur bedeutet dies schnell mal bis zu 14 einzelne Bilder in unterschiedlichen Größen zu erstellen, auf den Server zu laden und zu verknüpfen.

html picture-tag

Unser Tribut an alle Mobile-User mit geringer Bandbreite und Retina-Displays

Mit dem neuen fluid-basierten Content-Elemente-Rendering in der jüngsten Version von TYPO3 haben wir eine Lösung ausgearbeitet, welche es erlaubt mit nur einer Grafik die gewünschten Bild-Größen einzelner Viewports im Backend einfach auszuwählen.
Der Rest läuft nun ganz automatisch ab!

Ihre Grafik wird mit einem Klick auf allen Viewports in die optimale Größe gebracht.
Die Möglichkeit den Bildausschnitt über die Crop-Funktion zu wählen bleibt dabei selbstverständlich erhalten.

Keine Lust mehr darauf alle Fotos manuell mit Photoshop auf die richtige Größe zu bringen?
Wir auch nicht!

mask image online
Bild-Ausschnitt wählen