Hi I have been getting familiar with the Salt (Wireframe) functionality and was wondering
how it could be extended with styles and some features from other
projects to promote a mobile theme. Using IOS as an example here but generic would do.
This is a bit of a fanatasy mashup but it would be good to polish up the Salt Project for presentations and other documents.
Following list scrapped from :
https://developer.apple.com/design/human-interface-guidelines/
Icons and Images
=================
App Icons
-----------
(&appSettings)
(&appPhone)
(&appMail)
(&appMessage)
(&appClock)
(&appPhoto)
Launch Screens
--------------
-Describes Screen Sizes
System Icons - /ios/icons-and-images/system-icons/
-------------
(&share) Share Icon
(&add) Add Icon
(&book) Bookmarks Icon
(&camera) Camera Icon
(&cancel) Cancel Icon
(&done)
(&edit)
(&fforward) Fast Forward Icon
(&organize)
(&pause)
(&play)
(&redo)
(&refresh)
(&reply)
(&rewind)
(&save)
(&glass) Search Icon
(&stop)
(&trash)
(&undo)
Other Icons
(<) Left < Icon
(>) Right > Icon
(&plus) Plus Icon
(&cloud)
(&vanish)
Bar
======
Navigation Bars - /ios/bars/navigation-bars
||<centre>[[All][Missed]]</centre>|| -Sort Centred Buttons
Search Bars -/ios/bars/search-bars/
||[(&glass) Search ..]|| -Full width Search Bar
||[(&glass) Search | ..]|| -Half Width Search Bar
||<centre>[(&glass) Search]</centre>|| -Centered Search Bar
Scope Bars -
||[All Mailboxes][Current Mailboxes]|| -Full width Scope Bar
Status Bar
----------
Tab Bar /ios/bars/tab-bars/
-------
|| "(&multi)\n Photos" | "(&run)\n Memories" |(&cloud)\n Shared|(&vanish) \n Albums ||
Tool Bar
---------
Controls
==========
Buttons - /ios/controls/buttons/
(+) Add Button
(i) Info Button
(t) Tick Button
(x) Cross Button
(|>) Play Button
Context Menu - /ios/controls/context-menus/
(©) Copy Icon
(&share) Share Icon
(&love) Favourite Icom
(&multi) Show All Icon
(&trash) Remove Icon
Page Controls - /ios/controls/page-controls/
[(*..)] small indicator dots left hightlight
[(.*.)] small indicator dots centre hightlight
[(..*)] small indicator dots right hightlight
Sliders - /ios/controls/sliders/
||(&leftSlider)|| Full width knob left
||(&rightSlider)|| Full width knob centre
||(¢relider)|| Full width knob right
||(&dim)(&rightSlider)(&bight)|| Full width knob centre
Switch /ios/controls/switches/
(&offSwitch)
(&onSwitch)
List not complete but indicative
@startsalt
!define IOSPuml https://raw.githubusercontent.com/mobilesalt/ios-icons-for-plantuml/master/dist
!includeurl IOSPuml/IOSCommon.puml
!includeurl IOSPuml/icons/all.puml
skinparam applescreenX 320px
skinparam applescreenY 568px
skinparam ios {
IOSScreenX IOS_X
IOSScreenY IOS_Y
BackgroundColor IOS_BG_COLOR
BorderColor IOS_BORDER_COLOR
}
screen <<IOS>>{
||No SIM <&wifi> | <&bluetooth> <&battery-full>||
||< <centre>My Mobile Page</center>||
||..||
||<centre><img:http://plantuml.com/logo3.png></centre>
||..
||To do something, select Option1 | *
||-- | --
||Operation1 | (&offSwitch)
||-- | --
||Link to View1 | >
||-- | --
||Link to View2 | >
||-- | --
||Link to View3 | >
||-- | --
||<br:6> '6 breaking lines
||-- | --
||(&home)Home | (i)help | (&glass) Search) | apply
||-- | --
} as screen1
@endsalt