Simulieren von Apps (bzw einer App-Idee) für die Uni

[Puffi]

Hallo zusammen,
ich muss für die Uni eine Idee und auch das Design für eine iOS-App vorstellen. Die Idee und das Design (einige "grobe" Zeichnungen in PowerPoint) stehen bereits. Jetzt würde ich noch gerne einen Schritt weiter gehen und das Design der App in irgend einer Weise simulieren. Ich weiß, dass man einen kostenpflichtigen Dev-Account benötigt, um das ganze dann auch auf einem iDevice testen zu können (den kostenlosen Account habe ich). Soweit möchte ich nicht gehen, da es nur um die Präsentation der App für die Uni geht. Die Simulation sollte nichts groß "können". Ich würde nur gerne über eine Interaktion aus einem Auswahlmenü auf unterschiedliche Seiten navigieren können, und wieder zurück. Die angezeigten Seiten können ruhig statisch sein. Also keine Aneinanderreihung von Bildern (seien es ppt-Folien oder PDF-Files etc...), ich hätte gerne die Möglichkeit der Interaktion in einer Simulation.
Was wäre denn dafür die beste Möglichkeit? Ich habe zum Beispiel von InDesign von Adobe gehört. Allerdings kann man da, soweit ich weiß, keine Simulation starten, solange man keinen kostenpflichtigen Dev-Account besitzt. Welche Möglichkeiten gibt es noch, eine App-Idee in einer frühen Entwicklungsphase geeignet präsentieren zu können? Vielen Dank im Voraus

 

[sebi96]

also ich würd mir das als Webapp erstellen.

Z.B. http://trywebapp.net/ , siehe der Entsprechenden Demo: http://demo.webapp-net.com/.

Damit hättest du sogar ein iOs-Nativ aussehende WebApp. Alternative wäre auch noch jQueryMobile empfehlenswert.

Vorrausetzung wäre allerdings HTML, JS Kenntnisse.

 

[Puffi]

Vielen Dank für die schnelle Antwort. Die WebApp.Net habe ich direkt mal ausprobiert. Leider ist das ganze anscheinend noch in Arbeit, die Doku ist nur für die wenigsten Elemente vorhanden. jQueryMobile scheint da etwas ausgereifter (kannte beide bis dato nicht). Kenntnisse in HTML/JS sind vorhanden, also ist das kein Problem. Wieso genau würdest du jetzt WebApp.Net bevorzugen?

 

[martinv2]

Ich würde nur gerne über eine Interaktion aus einem Auswahlmenü auf unterschiedliche Seiten navigieren können, und wieder zurück.

So etwas kann man in Xcode recht einfach erstellen und dann mit dem eingebauten iOS-Emulator auf dem Mac laufen lassen und zeigen (oder auch aufzeichnen).

 

[Puffi]

Ich habe zur Zeit auf meinem MB(2008 white) nur Leopard (10.5). xCode Version ist 3.1.3 und höher komme ich glaube auch nicht. Das heißt ich bin noch auf dem Stand vom 1. iPhone. Ist es trotzdem einfach möglich eine App zu bauen oder war das "damals" noch umständlicher?

 

[BerndderHeld]

Was du machen willst nennt man Wireframing. Das wird üblicherweise in der Appentwicklung gemacht um Kunden die Idee einer App zu vermitteln bevor das Programmieren beginnt.

Google mal danach, es wird bestimmt auch was mit ner Testversion oder als Freeware geben.

 

[Puffi]

Habe mir jetzt mal einige Mockup/Wireframe-Programme angeschaut. Persönlich finde ich die Umsetzung über eine WebApp wie jQueryMobile im Endeffekt eleganter. Vor allem, da die meisten Wireframe-Programme kostenpflichtig sind und die Demos meist eingeschränkte Funktionen besitzen. Aber danke für den Vorschlag.

 

[sebi96]

Wieso genau würdest du jetzt WebApp.Net bevorzugen?

Weil soweit ich weiß, jQueryMobile keine iOs-Natives-Userinterface hat und ich dachte, dass es dir eventuell darauf ankommt. Wenn ich eine Webapp erstellen würde, würd ich aber definitiv auf jQueryMobile setzen, weil ich von jQuery nur gutes gewohnt bin - entsprechende Lektüre auch bereits angeschaft... $Zeitmangel!

---

Was du machen willst nennt man Wireframing. Das wird üblicherweise in der Appentwicklung gemacht um Kunden die Idee einer App zu vermitteln bevor das Programmieren beginnt.

Soweit ich ihn verstanden hat, hat er bereits ein Wireframe mit PP zusammen geklickt.
Der nächste Schritt, wegen der Interaktion, wäre dann "Prototyping"[1], bzw ein "Click-Dummy" zuerstellen

[1] http://de.wikipedia.org/wiki/Prototyping_(Softwareentwicklung)

---

PS: natürlich weis ich, dass die Begriff unterschiedlich genutzt werden. Bei dem einen gibt es zB zwishen Wireframe und Mock-up einen Unterschied, für den anderern ist es das ein und selbe...

 

[Puffi]

Also ich finde die Möglichkeit über jQueryMobile bisher sehr angenehm. Jetzt frage ich mich...Gibt es eine Möglichkeit meine WebApp dann auch auf einem iPhone dazustellen? Ich habe jetzt mal testweise die hmtl-Datei in Dropbox hochgeladen und auf dem iPhone geöffnet. Funktioniert mit den Klicks dann leider nicht ganz so gut. Gibt es da noch weitere Möglichkeiten die html-Datei einwandfrei auf dem iPhone darstellen zu können?

 

[sebi96]

Hochladen auf einen beliebigen gratis Webhoster sollte funktionieren.

Kann dir auch gerne behilflich sein beim Einrichten oder Empfehlen eines Hosters.

oder sollte es offline verfügbar sein?

ps: bei Dropobx und meinem iPad gehts...

----
bzw:

in den Offline-Storage via HTML5:
http://blog.naxos-software.com/inde...ionen-mit-HTML-5-Beispiel-auf-dem-iPhone.html

 

[Puffi]

Wenn ich die Datei in meine Dropbox lade und dann vom iPhone aus darauf zugreife kommt eben bei jedem "klick" das Dropbox-Menü auf (also oben und unten die "Toolbar"). Das nervt ein wenig. Der Klick an sich funktioniert aber. Welchen Gratis-Webhoster würdest du denn empfehlen? Würde das einfach gerne mal ausprobieren. Offline wäre natürlich auch okay, wobei ich mir darüber zum jetzigen Zeitpunkt noch nicht sicher bin (bzgl. genrelle Umsetzung)

 

[sebi96]

Sowohl lima-city als auch bplaced habe ich genutzt früher (heute hab ich einen VServer...).

Beide sind schon seit Jahren dabei und man kann sicherlich sagen, dass sie beide eine relativ gute Uptime und Stabilität haben. bplaced hat von den Features/ Leistung her, das bessere Angebot - bei Lima-City muss man afaik das ganze mittels Punkte-System freischalten (sosachen wie MySQL, etc...). Dafür hat Lima-City einen Upload-Tool, man brauch also nicht mittels einem FTP-Client die Dateien hochzuladen, was bei 1, 2 Dateien sicherlich entspannter ist.

bplaced: http://www.bplaced.net/
Lima-City: http://www.lima-city.de/

 

[Puffi]

Danke dir. Also habe meine html-Datei über FileZilla hochgeladen. Funktioniert einwandfrei. Kann ich auch php-Dateien hochladen? Die Standard-Seite ist ja die index.html. Wenn ich die lösche und eine index.php erstelle, funktioniert es dann noch? Ich würde meine App gerne dynamisch machen, daher die Umstellung auf php.

 

[sebi96]

Hey Puffi,

sowohl bplaced als auch Puffi unterstützen PHP.

Und ja, wenn du eine index.php erstellst, dann wird diese über den PHP-Interpreter augeliefert und du kannst somit das ganze dynamisch machen. In eine php-Datei kannst du auch ganz normal HTML, JavaScript, CSS schreiben, muss kein Stück PHP drin sein, wird funktionieren.

Beachte nur, dass du bei der Entwicklung und Testung, lokal dann auch besser einen Webserver und PHP-Interpreter hast, weil du die Dynamik ansonsten nicht nachvollziehen kannst und wahrscheinlich die Webapp dann auch nicht mehr funktionierne würde. Unter Windows empfhielt sich da XAMPP, die MacOsX Version ist jedoch noch Anno 2010... Da ich *noch* keinen Mac hier habe, kann ich dir entsprechend auch kein Software-Bundle empfehlen.

---
an was hast du denn da so gedacht bei "Dynamik"? Jenachdem was du darunter verstehst, lässt sich das ganze eventuellauch per Ajax lösen

 

[Puffi]

Super, hab´s schon einigermaßen hinbekommen. Mit dynamisch meinte ich nur, dass die Views durch Datenbankeinträge "dynamisch" erstellt werden. Man soll auch Einträge in die Datenbank machen können (soweit bin ich auch bereits). Hast du zufällig schon mit jQueryMobile Erfahrung? Ich hätte da eine ziemlich spezielle Frage was das coden angeht...

 

[sebi96]

Gut, hätte auch sein können, dass du manuell einfach willst die Einträge edititieren können, dann hätteste das ganze mittels Javascript und einer XML-Datei auch ohne PHP lösen können...

---

Ich würd einfach mal sagen, schieß los! Neben mir wird sicher noch der ein oder andere Web-Entwickler hier im Forum sein, wenn nicht: zu zweit googled man besser

 

[Puffi]

Na dann schieß´ ich mal los...
Was ich möchte: Eine Liste mit einem kleinen Button auf der rechten Seite. Klingt erstmal banal. Habe vom "Design" auch schon das richtige gefunden: Und zwar die Split-Button-List. Und hier mein Problem: Ich möchte eine Form bei einem Klick auf den rechten Button absenden. Dafür muss ich um jedes Listenelement eine Form bauen (es reicht nicht, die Form um die komplette Liste zu bauen. Jede Zeile hat eine eigene ID, die ich übertragen möchte). Wenn ich das allerdings mache, ist das Design der Liste kaputt (der Button verschwindet z.B.). Hier mal ein vorher/nachher-Bild:

Oben das Listenelement, wie ich es gerne hätte und unten wie es aussieht, wenn ich eine <form> um den Button bastel. Ich hätte eben gerne genau dieses Design. Gibt es evtl eine Möglichkeit da eine Form reinzubasteln ohne, dass die alles durcheinander bringt?

 

[sebi96]

also wenn ich dich nicht falsch verstanden habe, sollte das mittels jQuery sehr leicht umsetzbar sein:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>



<script type="text/javascript">
    $(document).on("click", '.listItem', function (event) {


        alert(event.target.id);


        return false;
    });
</script>




<ul>
    <li id="bar" class="listItem">asdadas</li>
    <li id="foo" class="listItem">asdadas</li>
</ul>

bei dem Minimalbeispiel wird bei einem klick auf eins der Listen-Elemente die jeweilige ID per Alert ausgegeben. Du kannst es also auswerten. Könntest auch aufrufe per Ajax, etc. machen. Ist zwar kein Form vorhanden, brauch man hier aber auch nicht. Oder meindest du das anders?

 

[Puffi]

Danke für deine Antwort! Es ist nicht ganz das was ich wollte, aber du hast mich auf eine Idee gebracht wie ich meine eigentliche Idee umsetzen könnte Das werde ich jetzt gerade mal ausprobieren. Was ich vorhabe: Ein eigenes Attribut zum Listenelement hinzufügen, bei einem Click auf das Element eine JS-Methode aufrufen und "this" als Parameter übergeben. Dann kann ich über diesen Parameter mein vorher angelegtes Attribut auslesen. Am Schluss wird dann der Wert in ein hidden-Formular eingesetzt, dass ich dann über JS abschicken kann. Hoffe das funktioniert auch so...

 

[sebi96]

Ok... Wenn du iwie Hilfe brauchst oder so, schreib dann einfach... Und am besten mit'nem kleinen Quellcode als Beispiel...

*viel Glück*