微信小程序，我的页面，用户昵称和头像的获取，及页面ui设计

实现用户昵称和头像获取可以通过调用微信小程序提供的API来完成，具体步骤如下：

1. 在页面的JS文件中调用`wx.getUserInfo()`方法获取用户信息。
2. 在获取成功的回调函数中获取用户昵称和头像，如：

   wx.getUserInfo({
     success: function(res) {
       var userInfo = res.userInfo;
       var nickName = userInfo.nickName;
       var avatarUrl = userInfo.avatarUrl;
     }
   });

3. 将获取到的用户信息渲染到页面上，可以通过setData方法将数据传递给页面的wxml文件进行渲染。

至于UI设计，可以考虑采用微信小程序提供的组件进行布局，如`view`、`text`、`image`等组件，通过设置它们的样式来实现UI效果。同时，也可以使用一些开源的UI组件库来加速开发进度，比如`weui`、`vant`等。

以下是一个简单的示例代码：

// index.js
Page({
  data: {
    nickName: '',
    avatarUrl: ''
  },
  onLoad: function () {
    var that = this;
    wx.getUserInfo({
      success: function(res) {
        var userInfo = res.userInfo;
        var nickName = userInfo.nickName;
        var avatarUrl = userInfo.avatarUrl;
        that.setData({
          nickName: nickName,
          avatarUrl: avatarUrl
        });
      }
    });
  }
});

// index.wxml
<view class="user-info">
  <image class="avatar" src="{{avatarUrl}}"></image>
  <text class="nick-name">{{nickName}}</text>
</view>

// index.wxss
.user-info {
  display: flex;
  align-items: center;
}
.avatar {
  width: 80rpx;
  height: 80rpx;
  border-radius: 50%;
  margin-right: 20rpx;
}
.nick-name {
  font-size: 32rpx;
  color: #333;
}